css border 圆角代码

今天我们在一起来看看CSS3中制作圆角的属性border-radius的具体用法，

CSS3中的border-radius出现后，应用相当广泛，使用简单，无需再处理图片，时间是省了，而且其还有多个优点：其一减少网站的维护的工作量，少了对图片的更新制作，代码的替换等等;其二、提高网站的性能，少了对图片进行http的请求，网页的载入速度将变快；其三增加视觉美观性。既然border-radius有这么多好处，我们就从他的语法，属性和属性值等方面来看其如何应用。

有这么多，那我们就从示例开始吧：

向 div 元素添加圆角边框：

div

{

border:2px solid;

border-radius:25px;

}

例子 1

border-radius:2em;

等价于：

border-top-left-radius:2em; //左上角

border-top-right-radius:2em; //右上角

border-bottom-right-radius:2em; //右下角

border-bottom-left-radius:2em; //左上角