核心提示：css盒模型盒模型:盒模型--边框：围绕着内容和补白的线，可以设置它的粗细，样式和颜色这是边框的三个属性如：p{border:2px solid red;}也就是p{border-width:2px;...
css盒模型
盒模型:
盒模型--边框：围绕着内容和补白的线，可以设置它的粗细，样式和颜色这是边框的三个属性
如：p{border:2px solid red;}
也就是p{
border-width:2px;边框为2px
border-style:solid;样式为实心
border-color:red颜色为红色
}
border-style的样式有:dashed虚线，dotted点线，solid实线
border-width:可以设置为：thin,medium,thick(一般都用像素)
border-color:是十六进制的颜色
只设置一个方向或多个方向的边框：
p{border-bottom:1px solid red;}
盒模型的高度和宽度：
盒子的宽度=左边界+左边框+左填充+内容宽度+右边界+右边框+右填充
p{
width:200px;
padding:20px;
border:1px solid red;
margin:10px;
}
盒模型的填充：元素内容与边框之间的距离
p{padding:20px 10px 10px 30px;}顺序与下面相对应
p{
padding-top:20px;
padding-right:10px;
padding-bottom:10px;
padding-left:30px;
}
如果上下左右都相同则可以这么写：
p{padding:10px;}
上下相同，左右相同时可以这样：
p{padding:10px 20px;}
盒模型边界：元素与其他元素之间的距离(内容与padding基本一样)
