边框border课程总结

abstract：

边框border课程小结

1.border用来设置标签的边框样式

2.常用复合写法：

 border: 1px(边框宽度) solid(边框样式) #ccc(边框颜色);

 边框样式:double双层边框

 边框样式:dashed虚线边框

 边框样式:dotted点状边框

3.控制单层边框

 上边框：border-top；下边框:border-bottom；左边框：border-left；右边框：border-right

4.清除元素边框

border:none

5.设置圆角

 border-radius: 20px；值代表圆角半径，正方形大小设置半径后变成圆

 border-radius: 15px(左上) 10px(右上) 20px(右下) 0px(左下);
 设置2个border-radius: 15px(左上 右下) 10px(左下 右上);设置3个无效果

6.设置边框阴影

 box-shadow: 10px(x轴偏移距离) 5px(Y轴偏移距离) 10px(阴影模糊半径值越大越模糊) #ccc(阴影颜色);

 box-shadow: 0px 0px 10px red inset(阴影向内扩展);

Correcting teacher：灭绝师太Correction time：2019-02-26 09:19:17
Teacher's summary：你的布局倒是思路清奇,下次用div就好了!

WeChat

share