基本元素框
寬度和高度
- 一個元素的width被定義為從左內(nèi)邊界到右內(nèi)邊界的距離糊昙，同樣height也是辛掠。該屬性不能用于行內(nèi)非替換元素
width：<length>|<percentage>|auto|inherit
百分?jǐn)?shù)是相對于包含塊的width
height：<length>|auto|inherit
百分?jǐn)?shù)是相對于包含塊的height計(jì)算
外邊距和內(nèi)邊距
外邊距會在元素周圍創(chuàng)建額外的空白，“空白”通常指不能放其他元素的區(qū)域释牺，而且這個區(qū)域可以看到父元素的背景
margin：<length>|<percentage>|auto{1,4}|inherit
百分?jǐn)?shù)相對于包含塊的width
長度值和外邊距
margin設(shè)置長度時按照上右下左的順序（即順時針方向）
百分?jǐn)?shù)和外邊距
百分?jǐn)?shù)是相對于父元素的width計(jì)算的萝衩，所以如果父元素的width以某種方式改變，百分?jǐn)?shù)也會發(fā)生改變
*** 注意： 百分?jǐn)?shù)值的定義相對于父元素的width没咙，不僅用于左右外邊距還用于上下外邊距***
這樣設(shè)計(jì)是因?yàn)檎Ｇ闆r下大多數(shù)元素會足夠高以包含其后代元素（包括其外邊距）如果一個元素的上下外邊距是其父元素height的一個百分?jǐn)?shù)猩谊，就可能導(dǎo)致一個無限循環(huán)（父元素的height增加，以適應(yīng)后代元素的外邊距增加祭刚，而相應(yīng)的上下外邊距又必須增加牌捷，因?yàn)楦冈氐膆eight增加了）
- 可以混合的使用百分?jǐn)?shù)和長度值墙牌，比如
margin:10px 5% 10px 5%
值復(fù)制
- 如果缺少左外邊距的值，則使用右外邊距的值
- 如果卻上下外邊距的值暗甥，則使用上外邊距的值
- 如果缺少右外邊距的值喜滨，則使用上外邊距的值
簡單來說就是如果指定了三個值，那么第四個值即左外邊距的值會從第二個值撤防，也就是右外邊距的值復(fù)制虽风；如果指定了兩個值，那么第四個值會從第二個復(fù)制寄月，第三個值會從第一個復(fù)制辜膝；如果指定了一個值，那么其他三個值會復(fù)制這個值
比如：
h1{margin：0.25em 0 0.5em}等于0.25 0 0.5em 0
h1{margin:5px 10px } 等于 5px 10px 5px 10px
h1{margin：15px} 等于15px 15px 15px 15px
單外邊距屬性
margin-top|margin-bottom|margin-left|margin-right
負(fù)外邊距和合并外邊距
正常流中垂直相鄰?fù)膺吘鄷喜?/p>
外邊距和行內(nèi)元素
向一個行內(nèi)非替換元素應(yīng)用外邊距漾肮，它對行高沒有影響厂抖。但對于左右外邊距是生效的。
- 左外邊距應(yīng)用到元素的開始位置克懊，右外邊距應(yīng)用到元素的結(jié)束位置验游，而不是行的兩側(cè)，特別是在元素跨行的情況下保檐。外邊距只是通過改變元素內(nèi)容在行中起點(diǎn)的位置來影響換行耕蝉。
- 對于負(fù)外邊距會導(dǎo)致元素與左右兩邊元素重疊
- 對于替換元素，設(shè)置外邊距會影響行高夜只，左右外邊距的情況與非替換元素的情況一致
邊框border
- 邊框?qū)挾鹊哪J(rèn)值是medium垒在，通常是2px
- 邊框默認(rèn)的樣式是none 所以默認(rèn)看不到邊框
- 邊框顏色是元素本身的前景色，如果沒有聲明邊框顏色扔亥，它與文字顏色相同如果一個元素沒有任何文本场躯，那邊框與父元素文本顏色相同，因?yàn)閏olor可以繼承
- 元素的背景會延伸到邊框邊界之外旅挤，邊框繪制在元素背景之上踢关，因此對于虛線等樣式的邊框，可以看到透明部分的背景顏色粘茄。
有樣式的邊框
border-style：none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset|{1,4}inherit
- 樣式hidden等價于none签舞，不過應(yīng)用于表格除外，對于表柒瓣，hidden用于解決邊框沖突
- 對于double 其定義為兩條線加直接的空隙寬度等于定義的border-width寬度
將邊框設(shè)置為outside使元素看起開像一個凸起按鈕 - 邊框樣式依然按照順時針順序設(shè)置儒搭，可以設(shè)置為
border-style:solid dashed dotted solid - 簡寫方法同外邊距
- 可以單獨(dú)設(shè)置某一邊的樣式，比如border-top-style
