CSS隨筆1

1. ul，li的作用不是為了給列表加圓點，而是用來表示一個列表的語義，並且每個專案和每個專案之間是不分先後的。ul就是英語unordered list 無需列表的簡寫。li就是英語list item，列表項的意思。 （組標籤，所有的li必須包裹在ul裡面，ul的兒子不能有別的東西，只能有li）。
2. ol有序列表，和ul類似
3. 定義列表：
<dl>
<dt>北京</dt>
<dd>首都，個打法</dd>
<dt>上海</dt>
<dd>魔都，有黃普京</dd>
</dl>，dl定義列表，dt是定義標題，不能省略。dd定義描述J可以省略。
4. input的型別：text，password，redio（單選框），checkbox（核取方塊），submit，reset。HTML5還有date，color等，但是都不相容。
5. 標準的div+css頁面用的種類很少，如div p h1 span a img ul ol dl li input等。
6. 交集選擇器，如h3.special.zhongyao {
   color: red;
   }這時從IE7開始支援的，IE6不支援。交集選擇器一般都以標籤名開頭，比如div.haha。
7. • div p 後代選擇器
   • div.special 交集選擇器
   • div, p 並集選擇器
   • div>p 兒子選擇器
   • :nth-child 第幾個孩子選擇器
   • h3+p 下一個兄弟選擇器
8. 能繼承的屬性？color、text開頭的、line開頭的、font開頭的，這些關於文字樣式的，都能繼承。**所有關於盒子的、定位的、佈局的屬性都不能繼承。
9. CSS兩大特性：繼承性、層疊性
10. 權重：
    
    • 計算格式：id選擇器，類選擇器，標籤選擇器（256進位）。
    • 如果權重一樣，以後出現為準。
    • 如果沒有精確選中某個元素，那麼權重為0，無需計算，比如繼承。如果大家都是0，那麼有一個就近原則，誰描述的近，聽誰的。
11. !import無法提升繼承的權重，無法打破就近原則，只能加重直接選擇上的選擇器的權重。

**選擇上了，數權重（id數量，類的數量，標籤的數量）。如果權重一樣，誰寫在後面聽誰的。沒有選擇上，通過繼承影響的，就近原則，誰描述的近聽誰的。如果描述的一樣近，比如選擇器權重，如果權重再一樣重，誰寫在後面聽誰的。

1. padding：top上、right右、bottom下、left左。綜合屬性，上右下左。

塊級元素：

• 霸佔一行，不能與其他任何元素並列
• 能接受寬、高
• 如果不設定寬度，那麼寬度將預設變為父親的100%

行內元素：

• 與其他行內元素並排
• 不能設定寬、高，預設的寬度就是文字的寬度

塊級元素轉為行內元素：display: inline;
行內元素轉變塊級元素：display:block;

CSS中一共有三種手段，使一個元素脫離標準文件流：
1. 浮動
2. 絕對定位
3. 固定定位

行內元素通過浮動會脫離標準流，所以就不需要display:block;了。

浮動的元素是脫標元素，不能把容器撐出高度

清楚浮動的方法：

1. 加高法：父親有高度（有高度的盒子，才能關注浮動）。
2. 隔牆法：clear: both，這種方式會導致margin失效。
   如：.blank16 { clear:both; height:16px;}
3. 內牆法：<div><ul></ul> <div style='clear: both'></div> </div>，把牆修在div的內部，而不是兩個div的中間。可以撐起第一個div的高度，而隔牆法不行。
4. overflow：hidden。所有溢位邊框的內容，都要隱藏掉。（經常和li標籤搭配中使用）

偏方：一個父親不能被自己浮動的兒子撐出高度，但是給父親加上overflow：hidden，就可撐出高度。