400-650-7353
您所在的位置:首頁 > IT干貨資料 > web前端 > 【Web前端基礎知識】:nth-child()和:nth-of-type()的區別

【Web前端基礎知識】:nth-child()和:nth-of-type()的區別

  • 發布: Web前端培訓
  • 來源:Web前端干貨資料
  • 2020-09-11 14:59:08
  • 閱讀()
  • 分享
  • 手機端入口

5.“ 的父元素里面的à第二個子元素”的意思就是:.box這個元素里面的第二個子元素:

6.別忘記我們第1條里面的“確定了選擇的是.box元素里面的p元素”,我們確定了這個第二個元素就是p元素,因此得出的效果是:

怎么樣?現在明白.box p:nth-child(2)是什么意思了吧~那我們再來看下.box p:nth-of-type(2)吧~

.box p:nth-of-type(2)

.box p:nth-of-type(2)的效果是選擇出了第二個p標簽,也就是.box里的第三個子元素。

翻譯下:

1.確定了選擇的是.box元素里面的p元素。

2.選擇的是.box的子元素里面àp元素à的父元素里面的à第二個p元素。

3.我們來分析下第二點到底是什么意思:”.box的子元素里面àp元素”指的是這兩個元素:

4.“ p元素à的父元素”指的就是.box這個元素:

5.“ 的父元素里面的à第二個p元素”的意思就是:.box這個元素里面的p元素里的第二個,所以這里我們就不用管其他元素,只找p元素就可以了,因此選擇出的結果是:

案例中的.box p:nth-child(2)和.box p:nth-of-type(2)區別就在于是第二個子元素還是第二個p元素

其實區別很簡單::nth-of-type為什么要叫:nth-of-type?因為它是以"type"來區分的。所以我們只需要找這個類型的元素,其他元素都可以視而不見。

文章“【Web前端基礎知識】:nth-child()和:nth-of-type()的區別”已幫助

>>本文地址:http://www.028benet.com/zhuanye/2020/55049.html

THE END  

聲明:本站稿件版權均屬中公教育優就業所有,未經許可不得擅自轉載。

1 您的年齡

2 您的學歷

3 您更想做哪個方向的工作?

獲取測試結果
  • 大前端大前端
  • 大數據大數據
  • 互聯網營銷互聯網營銷
  • JavaJava
  • Linux云計算Linux
  • Python+人工智能Python
  • 嵌入式物聯網嵌入式
  • 全域電商運營全域電商運營
  • 軟件測試軟件測試
  • 室內設計室內設計
  • 平面設計平面設計
  • 電商設計電商設計
  • 網頁設計網頁設計
  • 全鏈路UI/UE設計UI設計
  • VR/AR游戲開發VR/AR
  • 網絡安全網絡安全
  • 新媒體與短視頻運營新媒體
  • 直播帶貨直播帶貨
  • 智能機器人軟件開發智能機器人
 

快速通道fast track

近期開班時間TIME

主站蜘蛛池模板: 午夜激情福利视频| 日本理论片午午伦夜理片2021| 我与白丝同桌的故事h文| 国产人妖tscd合集| 久久精品WWW人人爽人人 | 色噜噜狠狠色综合日日| 色偷偷www8888| 日日婷婷夜日日天干| 国内精品福利视频| 亚洲精品乱码久久久久久下载| ass日本乱妇bbw| 污污网站免费在线观看| 国内一级一级毛片a免费| 亚洲成人黄色网址| 男女一进一出抽搐免费视频| 欧美www视频| 国产又爽又粗又猛的视频| 久久久久久久久久久久久久久| 51在线视频免费观看视频| 欧美性videos高清精品| 国产特黄特色a级在线视| 久久精品乱子伦免费| 色综合久久精品中文字幕首页| 成人18视频在线观看| 人人爽人人爽人人片a免费| 67194老司机精品午夜| 欧美xxxxx做受vr| 国产乱女乱子视频在线播放| 中文天堂在线视频| 爱豆在线观看网址91|免费| 国产精品无码无片在线观看| 免费a级毛片在线播放| 91视频免费网址| 最近的中文字幕国语电影直播 | 国产无遮挡又黄又爽高清视| 久久久精品午夜免费不卡| 综合激情区视频一区视频二区| 天天干天天操天天玩| 亚洲免费成人网| 视频区小说区图片区激情| 好吊操在线视频|