css選擇器

jollywing 發(fā)布于2019-08-30 15:55 / 2980人閱讀

摘要：出現(xiàn)效果的只有第一個(gè)標(biāo)簽一個(gè)這是在后面的這是在后面的之前是選擇的標(biāo)簽，是關(guān)鍵字，當(dāng)鼠標(biāo)放上去的時(shí)候，樣式會(huì)被觸發(fā)，否則就是選擇的標(biāo)簽原來的樣式。也可以接一些選擇器，讓其只作用于選擇的內(nèi)容。

做項(xiàng)目遇到了一個(gè)css的問題，想記錄一下，然后開通了思否
一、常用的
1、.classname
2、#id
3、*
4、標(biāo)簽選擇器 {div} 、 {span}等，選擇了頁面全部的div、span等
二、進(jìn)階的
1、{ div, p,span}同時(shí)選擇選擇所有的div、p、span
2、{div p}選擇所有的 div里面 (不包含div)的所有的p標(biāo)簽，不論是不是子一級(jí)還是子n級(jí)
3、{div>p}選擇所有父級(jí)元素為div的所有的p標(biāo)簽，不會(huì)發(fā)生穿透的現(xiàn)象只會(huì)在父元素與子一級(jí)之間
4、{div+p}選擇div元素后面出現(xiàn)的第一個(gè)p標(biāo)簽。出現(xiàn)效果的只有第一個(gè)P標(biāo)簽

一個(gè)div
z這是在div后面的
這是在div后面的

5、{div:hover 、div>p:hover}“：”之前是選擇的標(biāo)簽，”hover“是關(guān)鍵字，當(dāng)鼠標(biāo)放上去的時(shí)候，樣式會(huì)被觸發(fā)，否則就是選擇的標(biāo)簽原來的樣式。hover也可以接一些選擇器，讓其只作用于選擇的內(nèi)容。（hover簡單的理解為就是選擇器上面的選擇器中間的一個(gè)關(guān)鍵詞，然后有鼠標(biāo)進(jìn)入與離開事件）
6、{關(guān)鍵詞: focus}一般作用于input或者textarea的文本輸入框中，當(dāng)點(diǎn)擊的進(jìn)入的時(shí)候觸發(fā)樣式
7、{關(guān)鍵字：first-letter}作用于選擇元素的第一個(gè)文字
8、{關(guān)鍵字：first-line}作用于選擇元素的第一行內(nèi)容
9、{關(guān)鍵字：first-child}選擇的是前面選擇元素的第一個(gè)所有的元素
10、{關(guān)鍵字：before}在選擇的元素前面加上內(nèi)容，使用的時(shí)候必須設(shè)置content屬性。
好吧暫時(shí)這樣，繼續(xù)寫項(xiàng)目
11、
12、

GPU云服務(wù)器云服務(wù)器 css選擇器基礎(chǔ)選擇器css css選擇 js css 加載器

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://specialneedsforspecialkids.com/yun/117441.html

相關(guān)文章

WEB前端 CSS

摘要：后代選擇器，兒子選擇器，毗鄰選擇器，弟弟選擇器。后代選擇器后代選擇器標(biāo)簽選擇器后跟標(biāo)簽后代，無論直屬還是間接直屬，直接后代毗鄰后代中最近的一個(gè)弟弟，找到和自己同級(jí)的標(biāo)簽如通過多個(gè)選擇器好到具體的標(biāo)簽。目錄 WEB前端 CSS WEB前端 CSS TOC CSS簡介 CSS引入方式 CSS結(jié)構(gòu) CSS選擇器標(biāo)簽選擇...

darry 2019-04-23 13:34 評(píng)論0 收藏0
編寫高效的 CSS 選擇器 – CSS魔法

摘要：最基本的選擇器是元素選擇器比如選擇器比如還有類選擇器比如。選擇器和類選擇器在速度上的差異基本上沒有關(guān)系。現(xiàn)在我們回到討論開始的地方，哪類選擇器是最高效的哪個(gè)是會(huì)影響選擇器效率的關(guān)鍵選擇器寫代碼的時(shí)候，關(guān)鍵選擇器是能否高效的決定因素。高效的CSS已經(jīng)不是一個(gè)新的話題了，也不是我一個(gè)非得重拾的話題，但它卻是我在工作之時(shí)，所感興趣的，關(guān)注已久的話題。有很多人都忘記了，或在簡單的說沒有意識(shí)...

forrest23 2019-08-02 16:16 評(píng)論0 收藏0
編寫高效的 CSS 選擇器 – CSS魔法

摘要：最基本的選擇器是元素選擇器比如選擇器比如還有類選擇器比如。選擇器和類選擇器在速度上的差異基本上沒有關(guān)系。現(xiàn)在我們回到討論開始的地方，哪類選擇器是最高效的哪個(gè)是會(huì)影響選擇器效率的關(guān)鍵選擇器寫代碼的時(shí)候，關(guān)鍵選擇器是能否高效的決定因素。高效的CSS已經(jīng)不是一個(gè)新的話題了，也不是我一個(gè)非得重拾的話題，但它卻是我在工作之時(shí)，所感興趣的，關(guān)注已久的話題。有很多人都忘記了，或在簡單的說沒有意識(shí)...

hyuan 2019-08-30 10:50 評(píng)論0 收藏0
前端面試題-CSS選擇器性能優(yōu)化

摘要：不要在編寫規(guī)則時(shí)用標(biāo)簽名或類名不要在編寫規(guī)則時(shí)用標(biāo)簽名把多層標(biāo)簽選擇規(guī)則用規(guī)則替換，減少查找避免使用子選擇器后代選擇器在中是最昂貴的選擇器。如果你關(guān)心頁面性能的話，他們真不該被使用擴(kuò)展閱讀前端面試題選擇器前端面試題優(yōu)先級(jí) 一、CSS選擇符 CSS選擇符由一些初始化參數(shù)組成，這些參數(shù)指明了要應(yīng)用這個(gè)CSS規(guī)則的頁面元素。作為一個(gè)網(wǎng)站的前端開發(fā)工程師，應(yīng)該避免編寫一些常見的開銷很大的CS...

Scott 2019-08-30 14:08 評(píng)論0 收藏0
前端面試題-CSS選擇器性能優(yōu)化

摘要：不要在編寫規(guī)則時(shí)用標(biāo)簽名或類名不要在編寫規(guī)則時(shí)用標(biāo)簽名把多層標(biāo)簽選擇規(guī)則用規(guī)則替換，減少查找避免使用子選擇器后代選擇器在中是最昂貴的選擇器。如果你關(guān)心頁面性能的話，他們真不該被使用擴(kuò)展閱讀前端面試題選擇器前端面試題優(yōu)先級(jí) 一、CSS選擇符 CSS選擇符由一些初始化參數(shù)組成，這些參數(shù)指明了要應(yīng)用這個(gè)CSS規(guī)則的頁面元素。作為一個(gè)網(wǎng)站的前端開發(fā)工程師，應(yīng)該避免編寫一些常見的開銷很大的CS...

XGBCCC 2019-08-01 18:42 評(píng)論0 收藏0