:only-child
當元素是唯一的子元素，被選擇。
HTML代碼：
<body> <div class="x"> <div>第一個DIV</div> <div>第一個DIV</div> <p>第一個P</p> </div> </body>
效果圖：
CSS代碼：
<style> div:only-child{ background-color:red; } </style>
因為div是body元素的唯一子元素，所以整個DIV都會變紅。
演示圖：
CSS代碼：
<style> p:only-child{ background-color:red; } </style>
因為P元素不是div元素的唯一元素，所以P的背景顏色不會變紅。
演示圖：
：only-of-type
選擇特定的，唯一類型的子元素。
HTML代碼：
<body> <div id="main" class="x"> <div id="a">第一個DIV</div> <div id="b">第一個DIV</div> <p>第一個P</p> </div> </body>
CSS代碼：
<style> div:only-of-type{ background-color:red; } </style>
此時選擇的div，是id為main的div，它是元素body的唯一類型（div）的元素，所以整個div會變紅。
演示圖：
而當把CSS代碼修改成下面的代碼，結果就會不同。
CSS代碼：
<style> .x div:only-of-type{ background-color:red; } </style>
此時選擇的div，是id為a和b的div，因為不是唯一，所以背景顏色不會變紅。
演示圖：
如果把CSS代碼中的div，改成p后，p的背景顏色會變紅，因為p是div里唯一類型的元素。
CSS代碼：
<style> p:only-of-type{ background-color:red; } </style>
演示圖：
