CSS圆角 -webkit-border-radius 详解

来自:互联网
时间:2018-08-26
阅读:

CSS圆角 border-radius:用这个属性能实现圆角边框的效果。 现在只有Mozilla/Firefox 和 Safari 3支持该属性。请看下面的示例代码: Mozilla/Firefox 和 Safari 3用户将在这里看到圆角边框 此外,设计者还可以随意指定圆角的位置,左上、左下、右上...

CSS圆角 border-radius:用这个属性能实现圆角边框的效果。

现在只有Mozilla/Firefox 和 Safari 3支持该属性。请看下面的示例代码:

Mozilla/Firefox 和 Safari 3用户将在这里看到圆角边框
此外,设计者还可以随意指定圆角的位置,左上、左下、右上、右下四个方向。在mozilla/firefox和safari中的具体书写格式如下:

-moz-border-radius-topleft / -webkit-border-top-left-radius
-moz-border-radius-topright / -webkit-border-top-right-radius
-moz-border-radius-bottomleft / -webkit-border-bottom-left-radius
-moz-border-radius-bottomright / -webkit-border-bottom-right-radius

Mozilla/Firefox 和Safari 3 中看到的左上圆角
Mozilla/Firefox 和Safari 3 中看到的右上圆角
Mozilla/Firefox 和Safari 3 中看到的左下圆角
Mozilla/Firefox 和Safari 3 中看到的右下圆角
返回顶部
顶部