开发者经常使用border-radius将矩形变成圆角矩形。大多数人这样写border-radius:5px;来满足网页布局的形状要求，但其实这个CSSProperties可以这么玩。border-radius的三种声明方式border-radius:10px;边界半径：2em；边界半径：50%；border-radius指定不同弯曲度数下的显示结果。现在设置四个宽度：200px；高度：100px；对于方形div，弯曲度设置如下：border-radius:10%;边界半径：25%；边界半径：40%；边界半径：50%；设置四个宽度时：200px；高度：100px；对于正方形div，弯曲度设置如下：border-radius:10%;边界半径：25%；边界半径：40%；边界半径：50%；显示结果为：border-radius分别指定每个角的弯曲度当声明border-radius:10px;时，相当于声明border-radius:10px10px10px10px;。四个角的值分别为左上-右上-右下-左下顺时针旋转，类似于指定盒模型的margin、border、padding。现在指定四个角为不同的曲率，结果如下：border-radius:10%25%40%50%;其中边界半径：10%25%40%50%；可以写成如下形式：border-top-left-radius:10%;border-top-right-radius:25%;border-bottom-right-radius:40%;边框左下角半径：50%；这是css3的一个新属性。分别指定border-radius的水平和垂直弯曲度数。如上图所示，border-radius每个角度的弯曲程度包括水平弯曲长度和垂直弯曲长度。边界半径：50%；相当于border-radius:50%/50%;前面是水平弯曲长度，后面是垂直弯曲长度。其中50%表示弯曲的长度为矩形border-radius长度的50%：2em1em4em/0.5em3em；相当于border-top-left-radius:2em0.5em;border-top-right-radius:1em3em;border-bottom-right-radius:4em0.5em;border-bottom-left-radius:1em3em;实例半圆border-radius:50%/100%100%00;半椭圆沿纵轴分割border-radius:100%00100%/50%;四分之一椭圆边界半径：100%000；CSS技巧（二）：形状
