CSS盒模型
1.盒子模型就是把HTML页面中的元素看作是一个矩形的盒子,也就是一个盛装内容的容器。每个矩形都由元素的内容、内边距(padding)、边框(border)和外边距(margin)组成。
2.内边距出现在内容区域的周围,当给元素添加背景色或背景图像时,该元素的背景色或背景图像也将出现在内边距中。
3.外边距是该元素与相邻元素之间的距离。
4.如果给元素定义边框属性,边框将出现在内边距和外边距之间。
5.盒子=内容+内边距+边框+外边距。
书写格式
分写:
border-top-style:样式;
border-top-width:宽度;
border-top-color:颜色;
合写:
单一个方向边框:border-top:宽度 样式 颜色;
样式综合设置:border-style:上边 [右边 下边 左边];
宽度综合设置:border-width:上边 [右边 下边 左边];
颜色综合设置:border-color:上边 [右边 下边 左边];
边框综合设置:border:四边宽度 四边样式 四边颜色;
边框样式属性值
none:无,此值是默认值;
solid:单实线;
dashed:虚线;
dotted:点线;
double:双实线。