CSS學習筆記（2）

CSS框模型

- element : 元素

- padding : 內邊距      不容許使用負值

h1 {padding: 10px 0.25em 2ex 20%;}

     能夠按照上、右、下、左的順序分別設置各邊的內邊距，各邊都可以使用不一樣的單位或百分比值

- border : 邊框。     但願邊框出現，就必須聲明一個邊框樣式。

h1 {border-width: 20px;}

忘記聲明邊框樣式是一個常犯的錯誤。根據如下規則，全部 h1 元素都不會有任何邊框，更不用說 20 像素寬了。設置邊框樣式，好比 solid 或 outset。border-style:

a:link, a:visited {

  border-style: solid;

  border-width: 5px;

  border-color: transparent;     透明邊框

  }

- margin : 外邊距     

能夠是負值，並且在不少狀況下都要使用負值的外邊距

值複製

h1 {margin: 0.25em 1em 0.5em;} /* 等價於 0.25em 1em 0.5em 1em */

h2 {margin: 0.5em 1em;} /* 等價於 0.5em 1em 0.5em 1em */

p {margin: 1px;} /* 等價於 1px 1px 1px 1px */

外邊距合併

假設有一個空元素，它有外邊距，可是沒有邊框、內邊距。在這種狀況下，上外邊距與下外邊距就碰到了一塊兒，它們會發生合併

註釋：只有普通文檔流中塊框的垂直外邊距纔會發生外邊距合併。行內框、浮動框或絕對定位之間的外邊距不會合並。