css學習筆記

仍是在大一的時候接觸的html，css。如今從新複習下。記錄下我認爲比較重要的注意點。

1. padding：會讓盒子變大，padding的顏色就是背景的顏色，一個margin，padding，border的盒子究竟佔了多大的空間？答案是，寬度是margin-left，margin-right，padding-left，padding-right，border-left，border-right，width之和，高度相似的方法計算

2. margin之間的重疊問題：

   1）若是是兩個普通的元素，之間的margin取決於大的那個

   2）若是都是浮動的，之間的margin則是兩個相加

   3）若是是父子元素，也會發生疊加

3. 內聯元素：

   img就是一個特殊的內斂元素，可是他能夠設置寬和高，並且和下面的div之間也有margin

   span也是一個內聯元素，這裏面設置寬高，上下邊距是沒有意思，它僅僅是包文字用的

   可是能夠用display：block轉化成內聯元素

4. background：

1. background-image: url(); 指定背景圖；默認是鋪開

2. background-repeat:repeat-x /no-repeat指定沿着哪一個方向重複

3. background-attachment:fixed; 圖片一直固定在左上角

4. background-position：這個就能夠把許多小圖標放在同一張圖片上

5. <a>

6. 對應有一個僞類，a：link，a：visted，a:hover，a:active（鼠標點擊的一瞬間）  

        這是有着前後順序的，順序顛倒了則不能正常顯示

    6 position

        absolute：絕對定位

        relative：相對定位

        fixed：固定定位（是絕對定位的一種）

        static：不定位，默認就是這個

        inherit：能夠繼承父元素的position的值

        相對定位元素仍然佔據原來的空間，而絕對定位下面的元素會頂上來

    7定位機制：

        css中三種基本的定位機制： 普通流，浮動，絕對定位