要实现圆角的效果其实很简单，用一个radius属性就行了。话不多说，直接上代码：
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><style type="text/css">.top{width: 100px;height: 100px;border: 1px solid #333;border-radius: 10px;/* 圆角的大小可以自己调 */}</style></head><body><div class="top"></div></body></html>
在浏览器打开：
就实现了这样的圆角效果。
而且我们还可以某一个角实现圆角效果，以下两段代码是等价的：
border-radius: 10px;
border-top-right-radius:10px;border-top-left-radius:10px;border-bottom-right-radius:10px;border-bottom-left-radius:10px;
如果你只想让边框的某一个角实现圆角效果的话，就只对那个角设置对应的属性就行了。
