border之深入理解

此文为张鑫旭老师CSS深入了解系列课程的学习笔记，观看张老师的教学视频收益匪浅。

传送门http://www.imooc.com/u/197450/courses?sort=publish

1. Border-width支持关键字：

Thin: 1px

Medium 3px

Thick 5px

 

2. Border-style类型

Solid 实线

Dashed 虚线

Dotted 点线

Chrome/FireFox : 小方块

IE：小圆

Double 双线

 

不常用：

Inset 内凹

Outset 外凸

Groove 沟槽

Ridge 山脊

 

3. Boder-color , box-shadow , text-shadow 颜色默认为color值

 

 

 

 

 

 

4. 设置透明边框

增加响应区域面积

 

 

 

 

 

5. 增加可视渲染区域（通过drop-shadow让png图片变色）

 

 

 

6. 两栏等高布局