CSS 選擇器

範例

<div>I am inside of a div element.</div>
<p>I am inside of a paragraph element.</p>

div {
  color: green;
}

p {
  color: red;
}

在第一個 CSS 規則，我選取了 <div> 元素、並將該元素的文字變成了綠色。在第二個 CSS 規則，我選取了 <p> 元素、並將該元素的文字變成了紅色。結果應該長成這個樣子：

深入理解

基本知識

• 基本選擇器

  • 類型選擇器 elementname
  • Class 選擇器 .classname
  • ID 選擇器 #idname
  • 通用選擇器 * ns|* *|*
  • 屬性選擇器 [attr=value]
  • 狀態選擇器 a:active, a:visited

• 複合選擇器

  • 鄰接同層選擇器 A + B
  • 通用同層選擇器 A ~ B
  • 直屬選擇器 A > B
  • 後代選擇器 A B

• 虛擬元素

• 虛擬類別