網(wǎng)頁css選擇器制作教程,怎樣區(qū)分后代選擇器和子代選擇器?
1.第一從符號(hào)上來區(qū)分后代選擇器:是用空格來分隔開來 例如<h1>一個(gè)<span>人</span>的戰(zhàn)爭</h1> 就是h1 span{}子代選擇器:用特殊符號(hào)> 例如 h1>span{}
2.第二從用法上區(qū)分后代選擇器html部分:<ul class="study"> <li>物理 <ul> <li>力學(xué)</li> <li>聲學(xué)</li> <li>電磁學(xué)</li> </ul> </li> <li>數(shù)學(xué) <ul> <li>微積分</li> <li>概率論</li> <li>博弈論</li> </ul> </li> </ul> css部分//使用子代選擇器的效果.study >li{ border:1px solid red;/*只給物理和數(shù)學(xué)加一個(gè)紅色方框*/}//使用后代選擇器的效果.study li{ border:1px solid red;/*給物理 力學(xué) 聲學(xué) 電磁學(xué) 和數(shù)學(xué) 微積分 概率論博弈論都加一個(gè)紅色方框*/}這說明子代是他是單傳只給物理和數(shù)學(xué)就斷子絕孫,后代是一代傳一代。
子代選擇器時(shí)效果圖:
后代選擇器時(shí)效果圖:
css調(diào)試工具?
css說是調(diào)試工具其實(shí)只是一段 Javascript 代碼,但非常實(shí)用,它會(huì)給頁面里所有的 DOM 元素添加一個(gè) 1px 的描邊(outline),方便我們?cè)谡{(diào)試 CSS 過程中分析、排查問題。
先來看看代碼,它有兩個(gè)版本,一個(gè)是使用的$$選擇器,代碼量更少(瀏覽器控制臺(tái)支持 $$ 選擇器);另一種就是傳統(tǒng)的document.querySelectorAll選擇器:
css選中表格有什么操作方法?
最快速的方法:在表格開頭點(diǎn)一下,然后按住shift鍵,在表格結(jié)尾點(diǎn)一下,即選定。
css后代選擇器可以寫幾個(gè)?
css后代選擇器可以寫5個(gè),本來css的后代選擇器可以選擇多個(gè),但是層級(jí)越深,效率越低,所以最好寫5個(gè)就行