CSS（層疊樣式表）是用于網頁元素樣式控制的語言，是構成網頁布局的重要一環。為了使用CSS編寫出正確的樣式規則，需要掌握以下語法構成。

選擇器 {
屬性: 值;
屬性: 值;
}

CSS語法規則由選擇器和聲明塊兩部分組成。選擇器指定了要應用樣式的HTML元素，聲明塊則包含了一個或多個屬性-值對，用于指定元素的具體樣式。

以下是CSS語法體系中的各個部分：

• 選擇器（Selector）：指定要添加樣式的元素。選擇器包括：

  • 標簽選擇器（tag selector）：基于HTML標簽名匹配元素。
  • 類別選擇器（class selector）：基于HTML類名匹配元素。
  • ID選擇器（ID selector）：基于HTML id匹配元素。
  • 屬性選擇器（attribute selector）：基于HTML元素屬性來匹配元素。
  • 后代選擇器（descendant selector）：基于一個元素的后代匹配元素。
  • 偽類選擇器（pseudo-class selector）：基于元素的狀態來匹配元素，如:hover、:active。
  • 偽元素選擇器：基于元素的特殊部分來匹配元素，如::before、::after。

• 聲明塊（Declaration block）：由一組屬性-值對組成，用于指定元素的具體樣式，即CSS屬性。聲明塊包括：

  • 屬性（Property）：代表要改變的樣式特征。一般是一個英文單詞，如font-size、color。
  • 值（Value）：代表屬性所要設置的具體值。可以有數值、顏色、固定值等。

在編寫CSS樣式表時，一般采用縮進、空格、換行等排版方式使得代碼可讀性更好。例如：

.box {
width: 200px;
height: 200px;
background-color: #f5f5f5;
}

上面代碼中，類選擇器.box選擇了所有class為box的元素，并對其應用了寬度、高度和背景顏色的設置。

了解CSS語法規則能夠讓前端開發者更加熟練地在HTML代碼中添加樣式，并創建出更美觀、易于維護的網站。