日韩成人A片一区二区三区-日韩成人黄色片-日韩成人在线视频-日韩吃奶摸下AA片免费观看-日韩大片免费看-日韩大片在线观看

15099959097
15099959097

網(wǎng)站建設(shè)中幾種CSS選擇器

網(wǎng)站編輯:玖樂網(wǎng)絡(luò)    發(fā)布時(shí)間:2021-11-11

  一個(gè)項(xiàng)目會(huì)有很多樣式和特效,如何用CSS選擇器控制網(wǎng)頁,下面講述網(wǎng)站建設(shè)中幾種CSS選擇器。

1,基本選擇器

 類選擇器(class選擇器)
 .one{font-size:12px;}
 唯一選擇器(ID選擇器)
 #one{font-size:12px;}
 通配符選擇器(*)
 *{font-size:12px;}
 tagName標(biāo)簽選擇器
 p{font-size:12px;}

2,層級(jí)選擇器

組合選擇器
例:div,p 相同屬性選擇出來
包含選擇器
例:div p 包含都可以選擇出來
子選擇器
子元素為選擇器2(只有父子關(guān)系才可以) 例:div > p
相鄰選擇器
緊貼在選擇器1之后的選擇器2元素 例 div + p
兄弟選擇器
選擇器1后面的所有兄弟元素  例 div ~ p

3,屬性選擇器

屬性選擇器就是根據(jù)屬性名或者屬性值來查找到某個(gè)元素
標(biāo)簽[屬性]
 1.  E[ATT] 匹配所有具有ATT屬性的E元素,不考慮屬性值。
 2.  E[ATT = VAL] 匹配所有ATT屬性等于VAL的E元素。
 3.  E[ATT ~= VAL] 匹配所有ATT屬性具有多個(gè)空格分隔的值,其中一個(gè)值等于VAL的E元素。
 4.  E[ATT |= VAL] 匹配所有的ATT屬性具有多個(gè)連接分隔符的值,其中一個(gè)值以val-開頭的E元素,主要用于lang屬性。比如:’en-us’,’en-gb’(了解3)。
 5.  E[ATT ^= VAL]屬性ATT的值以VAL開頭的E元素。
 6.  E[ATT $= VAL] 屬性ATT的值以VAL結(jié)尾的E元素。
 7.  E[ATT *= VAL] 屬性ATT的值中有VAL存在的E元素。

4,結(jié)構(gòu)性偽類選擇器

在CSS中引入的結(jié)構(gòu)性偽類選擇器的共同特征是允許開發(fā)者根據(jù)文檔樹中的結(jié)構(gòu)來指定元素的樣式
 在CSS中引入的結(jié)構(gòu)性偽類選擇器的共同特征是允許開發(fā)者根據(jù)文檔樹中的結(jié)構(gòu)來指定元素的樣式
        -   四個(gè)最基本的結(jié)構(gòu)性偽類選擇器
            1.  :root 將樣式綁定到頁面的根元素。
            2.  E:not() 對(duì)某個(gè)結(jié)構(gòu)元素使用樣式,但是想拍出這個(gè)元素下的子結(jié)構(gòu)元素。
            3.  E:empty 匹配所有為空的E元素。
            4.  :target 代表鏈接到目標(biāo)時(shí)。
        -   其他的結(jié)構(gòu)偽類選擇器
            -   E:first-child 對(duì)一個(gè)父元素中的第一個(gè)子元素E設(shè)置樣式。
            -   E:last-child 對(duì)一個(gè)父元素中的對(duì)吼一個(gè)子元素E設(shè)置樣式。
            -   E:nth-child() 對(duì)指定需要的子元素E設(shè)置樣式。
            -   E:nth-last-child() 對(duì)指定需要的子元素E設(shè)置樣式。
            -   E:nth-of-type() 與:nth-child()作用類似,但是僅匹配使用的同種標(biāo)簽元素。
            -   E:nth-last-of-type() 與:nth-last-child()作用類似,但是僅匹配使用的同種標(biāo)簽
            -   E:nth-child(an+b)
                -   a 表示每次循環(huán)中間隔幾個(gè)改變樣式。
                -   b 表示指定在循環(huán)中開始的位置。
            -   E:only-child 匹配父元素下僅有一個(gè)子元素,并且該子元素為E元素。
            -   E:only-of-type 匹配父元素下使用同種標(biāo)簽的唯一一個(gè)子元素E。
            -   E:enabled 匹配表單中激活的元素
            -   E:disabled 匹配表單中未激活的元素。
            -   E:checked 匹配表單中被選擇的radio或者checkbox元素。
            -   :focus 設(shè)置元素在其獲取鼠標(biāo)焦點(diǎn)的樣式。
            -   ::selection 匹配用戶當(dāng)前選中的元素(了解)。

5,狀態(tài)偽類選擇器

1. :link  設(shè)置超鏈接a在未被訪問前的樣式。
2. :visited 設(shè)置超鏈接a在其鏈接地址已經(jīng)被訪問的樣式。
3. :hover 設(shè)置元素在鼠標(biāo)懸停時(shí)的樣式。
4. :active 設(shè)置元素在被用戶激活時(shí)的樣式。 

Copyright2010 - 2020 www.yghxt.com All rights reserved.      電信備案:粵ICP備17009880號(hào)    花都seo 花都網(wǎng)站優(yōu)化 花都網(wǎng)絡(luò)推廣 花都網(wǎng)絡(luò)公司 花都建網(wǎng)站 花都做網(wǎng)站 花都網(wǎng)站制作公司 花都網(wǎng)站設(shè)計(jì)公司