免费视频淫片aa毛片_日韩高清在线亚洲专区vr_日韩大片免费观看视频播放_亚洲欧美国产精品完整版

打開APP
userphoto
未登錄

開通VIP,暢享免費電子書等14項超值服

開通VIP
HTML中CSS引用——選擇器的使用

一、元素選擇器

????1、書寫格式:標(biāo)記名{/*生命塊*/}

????2、所有與該標(biāo)記匹配的元素,都將應(yīng)用聲明塊中的規(guī)則

二、類選擇器

????1、書寫格式:.類名{/*聲明塊*/}

????????類名為 class的值

????2、所有class屬性為指定類名的元素,都將應(yīng)用聲明塊中的規(guī)則

????????eg:

<p class="color_blue size"> .color_blue{

color: skyblue;

}

.size{

font-size: 50px;

}

一個class標(biāo)簽可以寫多個類名,放在class的值中,分隔符為空格

三、ID選擇器

????1、書寫格式:#id值{/*聲明塊*/}

????2、id選擇器只會選擇一個元素,屬性id為指定值的元素,將應(yīng)用聲明塊中的規(guī)則

????3、同一個html文檔中,不同的id值不可重復(fù)。 即 元素中的id值必須唯一

四、通配符選擇器

????1、書寫格式:*{ }

????2、指頁面內(nèi)所有標(biāo)簽都適用的樣式

????3、范圍太廣,不適用

五、屬性選擇器

????1、書寫格式:input[type="text"]{ }

????【擴展】

????????1、選種以xxx開頭的元素

????????????書寫格式 元素名[屬性名^="屬性名開頭"]

????????????input[type^="t"]{}

????????2、選種以xxx結(jié)尾的元素

????????????書寫格式 元素名[屬性名$=屬性值結(jié)尾的內(nèi)容]

????????????input[type$="d"]

????????3、選中包含XXX的元素

????????????書寫格式 元素名[屬性名*=屬性值包含的內(nèi)容]

????????????input[type*="i"]

六、并集選擇器/組合選擇器

????1、書寫格式:元素A "," 元素B "," 元素C

????2、適用于多個不同標(biāo)簽,應(yīng)用相同的樣式

????3、聲明沖突需要計算層疊機制時,需將每一項分開單獨計算

七、偽類選擇器

????1、在html中不需要添加class屬性,直接在CSS中書寫

????【分類】

????????1、動態(tài)偽類選擇器

????????將鏈接標(biāo)簽<a>設(shè)置樣式,書寫格式:標(biāo)簽:link{ }

(1)link和visited必須放在最前面(無先后順序)

(2)link和visited只能用于<a>標(biāo)簽,屬于靜態(tài)偽類選擇器

(3)link和visited后面是focus

????????????????鎖定,將自身的樣式變化賦予指定的標(biāo)簽

????????????????例:input:focus span{corlor:deeppink},鼠標(biāo)選種input,則span標(biāo)簽的內(nèi)容變成deeppink

(4)focus后面是hover

(5)hover后面是active

????????????通常情況下,我們會用到1245

????????????????{記憶方法:網(wǎng)絡(luò)通用——愛恨原則:love hate}

???????????????????? l v h a

????????2、結(jié)構(gòu)偽類選擇器

????????????書寫格式:元素:nth-child(n){}

????????????????eg:section>p:first-child{}

????????????????解釋:選種section下的第一個子元素,如果為p元素,則進行樣式變化;若不是,則不變

????????????(1)要將奇數(shù)和偶數(shù)項分開添加樣式

????????????????????元素:nth-child(2n)

????????????????????????選偶數(shù)項元素

????????????????????????????even

????????????????????元素:nth-child(2n 1)

????????????????????????選種奇數(shù)項元素

????????????????????????????odd

???????? (2)只選中前m個同樣的元素

????????????????????元素:nth-child(-n m)

????????????????????中間不能插入其他元素

???????????? (3)選種A標(biāo)簽下的B元素中的第n個

????????????????????A>B:nth-of-type(n){}

???????????? (4)選種A標(biāo)簽下的B元素中的倒數(shù)第n個

????????????????????A>B:nth-last-of-type(n){}

????????3、否定偽類選擇器

????????????選種除了第n個元素的其他同類元素

????????????????元素:not(:nth-child(3)){}

七、偽元素選擇器

????CSS創(chuàng)建的元素,都是選種元素的子元素

????分類

????????元素::before{}

????????????選種元素的第一個子元素

????????元素::after{}

????????????選種元素的最后一個子元素

????????元素::first-line{}

????????????選種元素的第一行

????????元素::first-letter{}

????????????選種元素的第一個字

????????????

????????????

來源:https://www.icode9.com/content-4-554451.html
本站僅提供存儲服務(wù),所有內(nèi)容均由用戶發(fā)布,如發(fā)現(xiàn)有害或侵權(quán)內(nèi)容,請點擊舉報。
打開APP,閱讀全文并永久保存 查看更多類似文章
猜你喜歡
類似文章
小白入門你教程CSS選擇器
CSS的選擇器
征服高級CSS選擇器
前端必須掌握30個CSS3選擇器
Jquery選擇器
Web Scraper 高級用法——CSS 選擇器的使用 | 簡易數(shù)據(jù)分析 15
更多類似文章 >>
生活服務(wù)
分享 收藏 導(dǎo)長圖 關(guān)注 下載文章
綁定賬號成功
后續(xù)可登錄賬號暢享VIP特權(quán)!
如果VIP功能使用有故障,
可點擊這里聯(lián)系客服!

聯(lián)系客服