08CSS边框边距

CSS边框边距

---

边框样式——border-style

border-top-style border-bottom-style border-left-style border-right-style

none 不显示边框默认值dotted 点线dashed 虚线亦短线solid 实线double 双直线groove 凹型线ridge 凸型线inset 嵌入式outset嵌出式

边框样式属性中border-style是一个复合属性，其他4个都是单个边框的样式属性，只能取一个值，而复合属性border-style可以同时取一到4个值。 下面分别说明border-style属性的4个取值方法：  取一个值：四条边框均使用这一个值。e:s  取两个值：上下边框使用第一个值，左右边框使用第二个值， 两个值一定要用空格隔开。  取三个值：上边框使用第一个值，左右边框使用第二个值，下边框使用第三个值，取值之间要用空格隔开。  取4个值：四条边框按照上、右、下、左的顺序来调用取值。取值之间也要用空格隔开。

边框宽度——border-width

border-width border-top-width border-bottom-width border-right-width border-left-width

thin 细边框；medium 中等边框；thick 粗边框

边框颜色——border-color

border-color border-top-color border-bottom-color border-left-color border-right-color

在使用边框颜色复合属性border-color时，如果只设置1种颜色，则四条边框的颜色一样；设置2种颜色，则边框的上下为一个颜色，左右为另一个颜色； 设置3种颜色，边框的颜色顺序为上、左右、下；设置4中颜色，边框的颜色顺序为上、右、下、左。

边框属性——border

border:<边框宽度>||<边框样式>||<边框颜色> border-top: <上边框宽度>||<上边框样式>||<上边框颜色> border-right: <右边框宽度>||<右边框样式>||<右边框颜色> border-bottom: <下边框宽度>||<下边框样式>||<下边框颜色> border-left: <左边框宽度>||<左边框样式>||<左边框颜色>

边距——margin-top /margin-bottom /margin-left/ margin-right/margin margin-top:长度|百分比|auto margin-bottom: 长度|百分比|auto margin-left: 长度|百分比|auto margin-left: 长度|百分比|auto margin: 长度|百分比|auto

填充——padding-top／padding- bottom /padding-left / padding- right /padding padding-top:长度|百分比 padding-bottom: 长度|百分比 padding-left: 长度|百分比 padding-right: 长度|百分比 padding: 长度|百分比