亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

用p:nth-child(n)的時候就限定子元素是p了,這樣和p:nth-of-type(n)還有差別嗎?

用p:nth-child(n)的時候就限定子元素是p了,這樣和p:nth-of-type(n)還有差別嗎?

yy_0017 2016-04-21 15:01:06
查看完整描述

1 回答

已采納
?
qq_青棗工作室_0

TA貢獻446條經驗 獲得超754個贊

有差別啊。

p:nth-child(n) 是第n個子元素(但是第n個子元素不一定能找到p標簽)

p:nth-of-type(n) 是第n個p子元素(只找里面的p標簽,而且是找到后的第n個p標簽)

例如:

<!DOCTYPE?HTML>
<style>
????p:nth-child(2)?{
????????background-color:red;
????}
????p:nth-of-type(2)?{
????????background-color:green;
????}
</style>
<div>
????<span>span1</span>
????<p>p1</p>
????<p>p2</p>
</div>

這里,div下的子元素既有span,又有p。第2個子元素,跟第2個子p元素,是不同的意思。

http://img1.sycdn.imooc.com//571885b50001f7c502390110.jpg


類似地,你想想,如果是p:nth-child(1),就找不到p標簽了。而?p:nth-of-type(1) 是能找到第一個p標簽的。


查看完整回答
2 反對 回復 2016-04-21
  • 1 回答
  • 0 關注
  • 1684 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號