課程
/前端開發(fā)
/HTML/CSS
/十天精通CSS3
ul > li 選擇了ul下的所有l(wèi)i元素,而ul > li:first-child 只選擇了ul下的第一個li元素,是這樣理解嗎?還是ul下的li的第一個子元素?
2016-04-25
源自:十天精通CSS3 6-6
正在回答
ul > li 選擇了ul下的所有l(wèi)i元素,而ul > li:first-child 只選擇了ul下的第一個li元素,你可以親自寫一下試試就明白了
weibo_諸小呆_0 提問者
程序是一行行的讀?先從這個函數(shù)這里入口setTimeout('startMove()',3000);調用startMove()函數(shù)因為在header之前不能有任何輸出,因為你的PHP版本應該是5.4以上吧,5.4以上建議不使用MySQL連接數(shù)據庫了^_^...
<style type="text/css">? ul>li{?color:red;? }
div>p{color:red;}</style>
<ul>??? <li>運動:??????? <ul>????????? <li>籃球</li>
????????? <li>游泳</li>???????? </ul>
??? </li>??? <li>水果:??????? <ul>??????????? <li>草莓</li>
??????????? <li>香蕉</li>? ??????? </ul>??? </li>??????? <li>??????????? 沒有了??????? </li>? <!--?? //上面沒啥說的 -->? ? <!-- //問題在這里:是不是比較奇葩,按理說他是不應該被改變的。那你就錯了,不要小看html中的每一個標簽,有些嵌套規(guī)則(行內/塊級)是需要遵循的,新手容易忽略這一點。ul里面放其他標簽,不光不符合語義,在有些瀏覽器里面會有問題。此處:如果li前面有其他標簽,瀏覽器會認為其他元素為li的子節(jié)點 -->? ??? <p><li>我的愛好:xxxxxxxxx</li></p>
? <!--?? //這里就能說明了,不過好像意義不大,不符合規(guī)范?-->???? <div><li>ssssss</li></div>? ? <!-- //同樣這里嵌套有問題,只是舉個栗子 -->? <span><li>dddddddd</li></span>? <strong><li>dddd</li></strong>? <em><li>ccccc</li></em>
</ul>
<!-- //這里有個正確栗子,希望給你啟發(fā) --><div><span><p>我是jenes</p></span><p>我住在火星</p></div>
<p>我最好的朋友是css</p>
<div><span><p>我的樣式不會改變。</p></span></div>
<!-- 紙上得來終覺淺,絕知此事要躬行,加油?。?!??-->
<ul>
? ? <p>我的愛好:</p>
? ? <li>運動:
? ? ? ? <li>籃球</li>
? ? ? ? <li>游泳</li>
? ? </li>
? ? <li>水果:
? ? ? ? <p>包括:</p>
? ? ? ? <ul>
? ? ? ? ? ? <li>草莓</li>
? ? ? ? ? ? <li>香蕉</li> ?
? ? ? ? </ul>
? ? <P>
? ? ? ? 其他:
? ? ? ? <li>
? ? ? ? ? ? 沒有了
? ? ? ? </li>
? ? </P>
這段代碼,css為:
ul > li{
?color: red;
}
可以試一下嗎?好像所有的li都被選擇了。
舉報
本課程為CSS3入門教程,深刻詳解CSS3知識讓網頁穿上絢麗裝備
1 回答first-child
3 回答first-child不懂
1 回答請問 ul > li:first-child{ color: red; } 與 ul > li :first-child{ color: red; } (li與:first-child之間有空格)的差異
3 回答有 nth-last-child(n),為何沒有nth-first-child(n) ?
4 回答原點的含義
Copyright ? 2025 imooc.com All Rights Reserved | 京ICP備12003892號-11 京公網安備11010802030151號
購課補貼聯(lián)系客服咨詢優(yōu)惠詳情
慕課網APP您的移動學習伙伴
掃描二維碼關注慕課網微信公眾號
2016-04-25
ul > li 選擇了ul下的所有l(wèi)i元素,而ul > li:first-child 只選擇了ul下的第一個li元素,你可以親自寫一下試試就明白了
2022-03-25
程序是一行行的讀?先從這個函數(shù)這里入口setTimeout('startMove()',3000);調用startMove()函數(shù)因為在header之前不能有任何輸出,因為你的PHP版本應該是5.4以上吧,5.4以上建議不使用MySQL連接數(shù)據庫了^_^...
2016-04-27
<style type="text/css">
? ul>li{
?color:red;
?
}
div>p
{
color:red;
}
</style>
<ul>
??? <li>運動:
??????? <ul>
????????? <li>籃球</li>
????????? <li>游泳</li>
???????? </ul>
??? </li>
??? <li>水果:
??????? <ul>
??????????? <li>草莓</li>
??????????? <li>香蕉</li>?
??????? </ul>
??? </li>
??????? <li>
??????????? 沒有了
??????? </li>
?
<!--?? //上面沒啥說的 -->
?
? <!-- //問題在這里:是不是比較奇葩,按理說他是不應該被改變的。那你就錯了,不要小看html中的每一個標簽,有些嵌套規(guī)則(行內/塊級)是需要遵循的,新手容易忽略這一點。ul里面放其他標簽,不光不符合語義,在有些瀏覽器里面會有問題。
此處:如果li前面有其他標簽,瀏覽器會認為其他元素為li的子節(jié)點 -->
?
??? <p><li>我的愛好:xxxxxxxxx</li></p>
?
<!--?? //這里就能說明了,不過好像意義不大,不符合規(guī)范
?-->
???? <div><li>ssssss</li></div>
?
? <!-- //同樣這里嵌套有問題,只是舉個栗子 -->
? <span><li>dddddddd</li></span>
? <strong><li>dddd</li></strong>
? <em><li>ccccc</li></em>
</ul>
<!-- //這里有個正確栗子,希望給你啟發(fā) -->
<div>
<span><p>我是jenes</p></span>
<p>我住在火星</p>
</div>
<p>我最好的朋友是css</p>
<div>
<span><p>我的樣式不會改變。</p></span>
</div>
<!-- 紙上得來終覺淺,絕知此事要躬行,加油?。?!??-->
2016-04-25
<ul>
? ? <p>我的愛好:</p>
? ? <li>運動:
? ? ? ? <li>籃球</li>
? ? ? ? <li>游泳</li>
? ? </li>
? ? <li>水果:
? ? ? ? <p>包括:</p>
? ? ? ? <ul>
? ? ? ? ? ? <li>草莓</li>
? ? ? ? ? ? <li>香蕉</li> ?
? ? ? ? </ul>
? ? </li>
? ? <P>
? ? ? ? 其他:
? ? ? ? <li>
? ? ? ? ? ? 沒有了
? ? ? ? </li>
? ? </P>
</ul>
這段代碼,css為:
ul > li{
?color: red;
}
可以試一下嗎?好像所有的li都被選擇了。