在CSS中,樣式規則的作用是定義一組屬性值,用于規定文檔中某些元素的呈現效果。樣式規則由選擇器和聲明塊組成。
選擇器用于定位文檔中的元素,而聲明塊則用于定義這些元素的樣式。一個樣式規則可以由單個選擇器和單個聲明塊組成,也可以由多個選擇器和單個聲明塊組成。以下是一個樣式規則的基本格式:
selector { property1: value1; property2: value2; ... propertyN: valueN; }
在這個樣式規則中,selector
就是選擇器,而property1
、property2
等是屬性名,value1
、value2
等是屬性值。一組屬性名和屬性值的組合就是聲明。
選擇器可以是元素選擇器、ID選擇器、類選擇器、屬性選擇器、偽類選擇器等等。其中最常見的是元素選擇器和類選擇器。元素選擇器指定一個或多個元素的類型,而類選擇器則指定一個或多個元素的class屬性。以下是一個使用元素選擇器的樣式規則:
p { font-size: 14px; color: #333; line-height: 1.5; }
這個樣式規則會將所有的<p>元素的字體大小設為14像素,顏色設為#333,行高設為1.5。而以下是一個使用類選擇器的樣式規則:
.highlight { background-color: yellow; color: #333; font-weight: bold; }
這個樣式規則會將所有class屬性為highlight的元素的背景顏色設為黃色,字體顏色設為#333,字體加粗。