css实现 圆角的 几种方法

css实现 圆角的 几种方法

有四种方法可以实现圆角。

第一、直接写CSS代码：border-radius

例如：border-radius:4px;或者可以四个不同圆度：border-radius:4px 4px 3px 3px
顺序是左上角，右上角，右下角，左下角

第二、四个圆角贴图；制作四个圆角的图片，然后用css定义

第三、直接制作整个圆角矩形背景

第四、定义12个背景色：左上角4个，右上角4个，右下角4个，左下角4个。
<b class="rt"><b class="r1"></b><b class="r2"></b><b class="r3"></b><b
class="r4"></b></b>

<b class="rb"><b class="r4"></b><b class="r3"></b><b class="r2"></b><b
class="r1"></b></b>

<b class="rt"><b class="rb1"></b><b class="rb2"></b><b class="rb3"></b><b
class="rb4"></b><b class="rb5"></b></b>

<b class="rb"><b class="rb5"></b><b class="rb4"></b><b class="rb3"></b><b
class="rb2"></b><b class="rb1"></b></b>2014-01-29

你好：

有三种方法可以实现CSS圆角。

第一、直接写CSS代码：border-radius

例如：border-radius:10px;

第二、四个圆角贴图；制作四个圆角的图片，然后用css定义

第三、直接制作整个矩形背景

总归而言，第一种方式最简单，只要一行代码。2014-01-29