border

一、border-width不支持百分比

边框不会因为设备大就增大，css中类似的还有：outline,box-shadow,text-shadow,...

二、支持关键字

thin:1px

medium:默认值 , 3px  （border-style:double 至少3px才有效果）

thick:5px

三、类型

border-style:solid 实线

border-style:dashed;虚线

border-style：dotted:点线

border-style:double:双线

border-style:inset 内凹

可以利用点线实现IE7、8下的圆形

.dotted{ border:150px dotted red}

可以利用双线来实现类似三大杠图标

{width:120px;height:20px;border-top:60px double;border-bottom:20px solid}

四、border-color and color

border-color默认颜色 就是color

精彩案例：hover与图形变色，只要一个color hover变化，就可以一起变色。

五、border 与三角等图形构建

.triangle{ border-width:12px;border-style:solid;border-color:red red red transparent}

因为

.triangle{width:100px;height:100px;border:100px solid;border-color:red green blue orange}



.triangle{width:100px;height:0px;border:0px solid;border-color:red green blue orange}