盒子尺寸構(gòu)成
- 一個盒子的寬度構(gòu)成：
左外邊距 + 左邊框?qū)?+ 左內(nèi)邊距 + width值 + 右內(nèi)邊距 + 右邊框?qū)?+ 右外邊距 - 一個盒子的高度構(gòu)成：
上外邊距 + 上邊框?qū)?+ 上內(nèi)邊距 + height值 + 下內(nèi)邊距 + 下邊框?qū)?+ 下外邊距
margin外邊距細(xì)化：
margin還可以細(xì)分為4個方向，每個方向都可以單獨控制，如下：
margin-top: 上外邊距
margin-right: 右。。。
margin-bottom:下。。。
margin-left: 左。。。
margin: 一個值； ——設(shè)置上，右，下，左4個方向均為該值；
margin：值1 值2； ——設(shè)置上下margin為值1，左右margin為值2；
margin:5px 10px; 表示上下margin是5px，左右margin是10px
margin:0 auto; 表示上下margin是0，左右margin是auto——auto對標(biāo)準(zhǔn)瀏覽器就解析為兩邊相等
margin：值1 值2 值3；——設(shè)置上margin為值1，左右margin為值2， 下margin為值3；
margin：值1 值2 值3 值4；——分別設(shè)置上，右，下，左4個方向的值；
padding內(nèi)邊距細(xì)化
同上
border邊框細(xì)化
- 12個對邊框線的控制屬性
border-top-style: 頂部邊框的線型。常見線型：solid , dashed, dotted
border-top-width: 頂部邊框的線寬；
border-top-color: 頂部邊框的線色；
border-right-style, border-right-width, border-right-color:。。。。。。。。。。。。。。。。。。。。。
- 3個設(shè)置線的某方面特性的綜合屬性
border-style: 可以使用1-4個值，用來設(shè)置4個方向的線的線型，其規(guī)則同margin值的設(shè)置。
比如：border-style:solid dashed; 表示上下邊框為實線，左右邊框為虛線；
border-width: 同理，可以設(shè)置1-4個值，表示4個方向的線寬。
border-color：同理。
- 4個設(shè)置每個方向邊框的所有特性的綜合屬性
border-top: 線型 線寬 線顏色；
border-right: 線型 線寬 線顏色；
border-bottom: 線型 線寬 線顏色；
border-left: 線型 線寬 線顏色；
- 一次性設(shè)置4個方向的3個特性
border: 線型 線寬 線顏色；
