网店系统里CSS3对background属性做出了一些重大改进，在CSS3标准里，我们可以把多个背景图片应用到同一个元素里。我们利用这个特性为容器加上圆角效果。在CSS中需要先把四个圆角的图片分别做好。
HTML：
<div class="box">
<h2>This is a heading</h2>
Lorem ipsum dolor sit amet,
consectetur adipiscing elit. Sed
vehicula ligula eu diam tincidunt
fermentum. Curabitur facilisis
enim non libero cursus eu varius
enim suscipit. Ut venenatis
vehicula lorem ut hendrerit. Ut
adipiscing augue sed ante volutpat
eget ornare erat facilisis. In hac
habitasse platea dictumst.
</div>
CSS:
.box {
background: url(top-left.gif) top left no-repeat,
url(top-right.jpg) top right no-repeat,
url(bottom-left.gif) bottom left no-repeat,
url(bottom-right.gif) bottom right repeat-y;
}
优点：没有多余的标记，可以分别设置每个圆角的半径。
缺点：使用了W3C未明确定义的方法，浏览器兼容性很差，目前只有Safari和Chrome对此方法支持良好。
网店系统 www.wqeshop.com 转载 来源：中国站长网