“:only-of-type”選擇器用來選擇一個元素是它的父元素的唯一一個相同類型的子元素。這樣說或許不太好理解,換一種說法。“:only-of-type”是表示一個元素他有很多個子元素,而其中只有一種類型的子元素是唯一的,使用“:only-of-type”選擇器就可以選中這個元素中的唯一一個類型子元素。
示例演示
通過“:only-of-type”選擇器來修改容器中僅有一個div元素的背景色為橙色。
HTML代碼:
<div class="wrapper">
<p>我是一個段落</p>
<p>我是一個段落</p>
<p>我是一個段落</p>
<div>我是一個Div元素</div>
</div>
<div class="wrapper">
<div>我是一個Div</div>
<ul>
<li>我是一個列表項</li>
</ul>
<p>我是一個段落</p>
</div>
CSS代碼:
.wrapper > div:only-of-type {
background: orange;
}
演示結果:

在CSS選擇中第8行輸入正確的代碼,將僅有一個P元素的背景修改為橙色。
注意:“:only-of-type”與“:only-child” 的區別
請驗證,完成請求
由于請求次數過多,請先驗證,完成再次請求
打開微信掃碼自動綁定
綁定后可得到
使用 Ctrl+D 可將課程添加到書簽
舉報