如何在 CSS 中組合類別和 ID 選擇器以實現有效的元素定位？

在CSS 選擇器中組合類別和ID

要同時使用ID 和類別來定位HTML 元素，您可以使用以下CSS語法：

div#content.myClass

此選擇器將選擇任何

具有ID「content」和類別「myClass」的元素。例如，以下 HTML 元素將透過上述 CSS 規則設定樣式：

<div class="sectionA">
<p>您也可以在選擇器中組合多個類別。例如，下列規則會選擇任何 </p>
<div>具有類別「myClass」、「aSecondClass」和「aThirdClass」的元素：<pre class="brush:php;toolbar:false">div#content.myClass.aSecondClass.aThirdClass

但是，此語法在 Internet Explorer 6 中不起作用。要在 IE6 中定位此類元素，您可以使用以下：

div.firstClass.secondClass

此外，您可以在選擇器中組合 ID 和類，以定位具有指定 ID 和任意 ID 的元素 班級。例如，以下規則將選擇任何

具有ID「content」和任何類別的元素：

div#content.sectionA

效能注意事項

需要注意的是，使用標籤名稱（例如“div”或選擇器中的“p”）會影響效能。使用標籤名稱會強制瀏覽器執行額外的過濾步驟，這會減慢渲染速度。為了提高效能，僅在必要時在選擇器中使用標籤名稱。