CSS3圆角边框的
属性是border-radius。
border-radius
属性可以给
一个元素的边框设置圆角。在CSS2时代,我们只能用
图片来实现这个
效果,但现在我们可以通过这个
属性轻松地完成这个任务。
语法格式:border-radius: Xpx;
其中X的值可以是
一个数值,表示圆角的半径以像素表示。
此外X的值还可以是四个数值,分别表示四个角的曲率半径,例如border-radius:5px 10px 15px 20px; 表示
左上角=5px,右上角=10px,右下角=15px,左下角=20px。
如果将border-radius
属性应用于包含在容器元素中的文本,那么圆角会应用于文本框本身,而不是文本本身。
预览
效果:
代码实现:
p{
border:1px solid black;
padding:10px;
border-radius:10px;
}
这段
代码会为p元素设置
一个1像素的实线黑色边框,在边框和内部
内容之间留有10像素的空间,并将边框的4个角都设置为圆角半径为10像素。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。