dw中css選擇器nthchild怎么使用?
我要評(píng)論CSS3中選擇器:nth-child()該怎么使用呢？下面我們就來(lái)看看:nth-child()選擇器的使用方法。
Adobe Dreamweaver CC 2018 V18.0 中文/英文安裝版 32/64位
- 類(lèi)型：網(wǎng)頁(yè)設(shè)計(jì)
- 大小：968MB
- 語(yǔ)言：簡(jiǎn)體中文
- 時(shí)間：2017-10-19
1、在新建的html文件中，建立幾個(gè)相同的標(biāo)簽，比如建立幾個(gè)p標(biāo)簽，如圖所示
2、p:nth-child(){}。冒號(hào)前面是需要加屬性的對(duì)象，后面的小括號(hào)內(nèi)填寫(xiě)數(shù)值，需要對(duì)第幾個(gè)p標(biāo)簽添加屬性，就輸入數(shù)字幾，大括號(hào)內(nèi)是需要對(duì)其添加的屬性設(shè)置
3、比如將第二個(gè)p背景顏色設(shè)置為紅色，第四個(gè)p背景設(shè)置為綠色；
p:nth-child(2){background-color:red;}
p:nth-child(4){background-color:green;}
4、在瀏覽器中預(yù)覽查看效果
5、如果內(nèi)容有父集的存在，如圖所示
6、那么在添加屬性設(shè)置時(shí)，可以添加div+空格+屬性名稱(chēng)，如圖所示，代表意思是：div中的第幾個(gè)p標(biāo)簽
以上就是Dreamweaver中nthchild選擇器的使用方法，希望大家喜歡，請(qǐng)繼續(xù)關(guān)注腳本之家。
相關(guān)推薦：
Dreamweaver怎么制作鼠標(biāo)經(jīng)過(guò)圖片晃動(dòng)的效果?
Dreamweaver網(wǎng)頁(yè)怎么制作一個(gè)帶有列表值的下拉菜單?
Dreamweaver CS6編輯瀏覽器列表無(wú)法添加瀏覽器怎么辦?
相關(guān)文章
- 這篇文章主要介紹了CSS :visited偽類(lèi)選擇器隱秘往事回憶錄,需要的朋友可以參考下2018-10-12
css選擇器中有小數(shù)點(diǎn)的標(biāo)簽獲取方法
這篇文章主要介紹了css選擇器中有小數(shù)點(diǎn)的標(biāo)簽獲取方法,需要的朋友可以參考下2018-03-26
CSS3 :default偽類(lèi)選擇器使用簡(jiǎn)介
CSS3 :default 偽類(lèi)選擇器只能作用在表單元素上，表示默認(rèn)狀態(tài)的表單元素。接下來(lái)通過(guò)本文給大家介紹CSS3 :default偽類(lèi)選擇器使用簡(jiǎn)介，感興趣的朋友跟隨腳本之家小編一起2018-03-15- 本文將詳細(xì)介紹CSS選擇器的新用法，感興趣的朋友一起學(xué)習(xí)吧2018-02-02
這篇文章主要介紹了CSS選擇器實(shí)現(xiàn)字段解析的相關(guān)資料,需要的朋友可以參考下2018-01-31- 這篇文章主要介紹了CSS中選擇器的權(quán)重值的計(jì)算的相關(guān)資料,小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-01-23
Dreamweaver中css選擇器中的類(lèi)怎么使用?
Dreamweaver怎么使用css選擇器中的類(lèi)？Dreamweaver中css選擇器中有很多功能，想要使用其中的類(lèi)，該怎么使用呢？下面我們就來(lái)看看詳細(xì)的教程，需要的朋友可以參考下2018-01-09
詳解CSS3選擇器:nth-child和:nth-of-type之間的差異
本篇文章主要介紹了CSS3選擇器:nth-child和:nth-of-type之間的差異，非常具有實(shí)用價(jià)值，需要的朋友可以參考下2017-09-18- 本文總結(jié)了30個(gè)CSS3選擇器,小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2017-04-13
css3類(lèi)選擇器之結(jié)合元素選擇器和多類(lèi)選擇器用法
這篇文章主要介紹了css3類(lèi)選擇器之結(jié)合元素選擇器和多類(lèi)選擇器用法,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2017-03-09
