图解css3:核心技术与案例实战. 3.4 CSS3圆角边框属性

  1. 云栖社区>
  2. 华章计算机>
  3. 博客>
  4. 正文

图解css3:核心技术与案例实战. 3.4 CSS3圆角边框属性

华章计算机 2017-05-02 10:08:00 浏览955
展开阅读全文

3.4 CSS3圆角边框属性

在Web页面上圆角效果很常见。圆角给页面增添曲线之美,让页面不那么生硬,但是为了设计圆角效果,Web设计师们要花费更多的时间与精力。

3.4.1 border-radius属性的语法及参数

CSS3中专门针对元素的圆角效果增加了一个圆角属性border-radius。Web设计师不会为Web页面中的圆角效果纠结了。

语法:

border-radius: none | <length> {1,4}[/<length>{1,4}] ?

border-radius是一种缩写方法。如果反斜杠符号“/”存在,“/”前面的值是设置元素圆角的水平方向半径,“/”后面的值是设置元素圆角的垂直方向的半径;如果没有“/”,则元素圆角的水平和垂直方向的半径值相等。另外四个值是按照top-left、top-rig

网友评论

登录后评论
0/500
评论
华章计算机
+ 关注
所属云栖号: 华章计算机