1、 border-radius

border-radius是一大堆CSS3属性中最受欢迎的一种，border-radius是CSS3中级别最高的一个属性。当设计者害怕一个层在将在不同的浏览器之间以不同的方式显示时，CSS圆角，一个很初级的知识，将引导他们开始学习。

我们为移动浏览器提供一个备用的观看体验的想法都非常好。奇怪的是，当这种方法出现在桌面浏览器上时，他们却又不这么认为。

-webkit-border-radius: 4px;

-moz-border-radius: 4px;

border-radius: 4px;

注意：请在Safari 5 和 IE9浏览器中执行”border-radius”语法。

圆

许多读者也许不会意识到我们可以用这个属性来做一个圆。

-moz-border-radius: 50px;

-webkit-border-radius: 50px;

border-radius: 50px;

如果想再添加点效果，我们可以利用Flexible Box Model（详情在8中）来使得文字在垂直在水平方向都居中。这需要加点代码，但这仅仅是对不同浏览器的补偿。

display: -moz-box;

display: -webkit-box;

display: box;

-moz-box-orient: horizontal; /* the default, so not really necessary here */

-webkit-box-orient: horizontal;

box-orient: horizontal;

-moz-box-pack: center;

-moz-box-align: center;

-webkit-box-pack: center;

-webkit-box-align: center;

box-pack: center;

box-align: center;