E:only-of-type

E:only-of-type { sRules }

需要注意2個(gè)要點(diǎn)：

• 首先，因?yàn)槠ヅ涞氖歉冈氐淖釉兀@意味著E元素必須作為某個(gè)元素的子元素存在（E元素的父元素最高是html，也就是說(shuō)E元素最高是body，這表示任何非html的元素都符合這個(gè)約束，因?yàn)閔tml元素是根元素）。

• 其次，父元素可以有多個(gè)子元素，但其中的子元素E必須是唯一的，不能出現(xiàn)多個(gè)。

  來(lái)看下面的例子：

  有如下一段CSS：

  .demo span:only-of-type { color: #f00; }

  該選擇器表示要匹配 .demo 下唯一的span元素

  示例一，假設(shè)有如下HTML：

  <div id="uaukcwsk2o2i" class="demo"> <span>span1</span> </div>

  毫無(wú)疑問(wèn)，因?yàn)閟pan1是 .demo 唯一的子元素，所以span1會(huì)被命中

  示例二，假設(shè)有如下HTML：

  <div id="uaukcwsk2o2i" class="demo"> <p>p1</p> <span>span1</span> </div>

  可以看到span1也會(huì)被命中，雖然此例中.demo有2個(gè)子元素，但span1是.demo唯一的span子元素

  示例三，假設(shè)有如下HTML：

  <div id="uaukcwsk2o2i" class="demo"> <p>p1</p> <span>span1</span> <span>span2</span> </div>

  此時(shí)span將不會(huì)被命中，因?yàn)?demo有2個(gè)span子元素，不滿(mǎn)足唯一性要求。

• 淺綠 = 支持
• 紅色 = 不支持
• 粉色 = 部分支持