如何使用CSS3创建圆角边框效果？

圆角边框属性是css3新增的属性，在圆角边框属性出现之前想要实现圆角边框都是用图片做背景实现的，现在有了圆角边框属性实现圆角效果就简单多了css设置圆角边框。

1.圆角边框属性 ：border-radius：可以为元素添加圆角边框css设置圆角边框，他可以一个值对四个角设置，也可以分别给每个角设置

先设置一个高和宽为200背景为红色的容器

（1）设置一个值 四个角都是相同的

实现方法：

效果如图：

（2）设置两个值 //两个值设置的分别是左上和右下、左下和右上

实现方法：

效果如图：

（3）设置四个值 //左上 右上 右下 左下 (顺时针顺序)

实现方法：

效果如图：

2、利用圆角边框还可以实现圆形和半圆效果

（1）圆形

实现方法：可以写成百分之五十css设置圆角边框，这样长和宽改变，也还是可以形成圆形

效果：

（2）半圆

实现方法：先做成一个圆形css设置圆角边框，然后把右下和左下的角度改为0，然后在把高度减去一半就可以形成半圆

效果：