(四十一)HTML標籤--2

1、樣式倒入模式css

1 行內樣式
    在標籤中添加一個style屬性,屬性值寫要設置的樣式
2 內接樣式
    添加一個style標籤,在標籤中寫要設置的樣式
3 外界樣式
    添加一個link標籤,href中指定要導入的css樣式文件的路徑
    css樣式文件中寫樣式
2、基本選擇器
1 標籤選擇器
    直接寫標籤名
2 id選擇器
    #id
3 class類選擇器
    .類名

3、高級選擇器
1 子類選擇器
     大於號
    選擇的是前一級標籤的子標籤spa

div>p_pid{   }

2 後代選擇器
     空格
    選擇的是前一級標籤的後代標籤繼承

.cls p{  }
3 並集選擇器
     逗號
    選擇全部符合條件的標籤字符串

p,div,a{  }
4 交集選擇器
    開頭是標籤名 後邊跟id或類選擇器(注意,沒有空格)
    div.cls{ } 或者div#id{ }
5 通用選擇器
    * 選擇全部的標籤

6 屬性選擇器
    1 [屬性名]  帶這個屬性名的標籤
    2 [屬性名='要匹配的屬性值'] 帶有屬性,屬性的名符合匹配要求
    3 [屬性名^='屬性值的開頭字符串']
    4 [屬性名$='屬性值的結尾字符串']
    5 [屬性名*='屬性值包含的字符串']

7 僞類選擇器
    a:    LoVe HAte
        四種狀態:   未被訪問的連接  link
                    訪問過的連接   visited
                    鼠標懸停的樣式  hover
                    鼠標按下時的樣式 active

    選擇第一個孩子:
        :first-child=>修改相同元素的第一個。
    選擇最後一個孩子:
        :last-child=>修改相同元素的最後一個。
    選擇指定的孩子:
        nth-child(n)=>修改相同元素中指定的那個。

    p:first-letter :選擇第一個字符
    p:before在標籤前邊添加一個標籤內容=>適用於全部相同元素
    p:after在標籤後邊添加一個標籤內容=>適用於全部相同元素

8 繼承性
    標籤能夠繼承父標籤的樣式: color, font-, text- line-

9 層疊性
    (選擇器權重同樣的時候)後邊添加的樣式會覆蓋前邊的樣式

10 權重
    id 權重100
     權重10
    標籤  權重 1
    !important 權重無限大

    都有!important 的時候,比較權重it

相關文章
相關標籤/搜索