CSS 樣式表代碼規(guī)則

使用HTML進(jìn)行標(biāo)記網(wǎng)頁(yè)內(nèi)容時(shí)，需要遵從一定的規(guī)范，CSS亦如此。要想熟練地使用CSS對(duì)網(wǎng)頁(yè)進(jìn)行修飾，首先要了解CSS樣式規(guī)則，具體格式如下

選擇器(屬性1:屬性值1;屬性2:屬性值2;屬性3:屬性值3;…}

上述樣式規(guī)則中，選擇器用于指定需要改變樣式的HTML標(biāo)記，花括號(hào)內(nèi)是一條或多條聲明。每條聲明由一個(gè)屬性和屬性值組成，以“鍵值對(duì)”的形式出現(xiàn)。

屬性是對(duì)指定的標(biāo)記設(shè)置的樣式屬性，例如字體大小、文本顏色等。屬性和屬性值之間用英文冒號(hào)“:”連接，多個(gè)“鍵值對(duì)”之間用英文分號(hào)“;”進(jìn)行分隔。

在書(shū)寫(xiě)CSS樣式時(shí)候，除了要遵循CSS樣式規(guī)則，還必須注意CSS代碼結(jié)構(gòu)中的幾個(gè)特點(diǎn)，具體介紹如下：

●CSS樣式中的選擇器嚴(yán)格區(qū)分大小寫(xiě)，而聲明不區(qū)分大小寫(xiě)，按照書(shū)寫(xiě)習(xí)慣一般將選擇器、聲明都采用小寫(xiě)的方式。

●多個(gè)屬性之間必須用英文狀態(tài)下的分號(hào)隔開(kāi)，最后一個(gè)屬性后的分號(hào)可以省略但是為了便于增加新樣式最好保留。

●如果屬性的屬性值由多個(gè)單詞組成且中間包含空格，則必須為這個(gè)屬性值加上英文狀態(tài)下的引號(hào)。例如:

p {font-family: “Times New Roman"}

●在編寫(xiě)CS代碼時(shí)，為了提高代碼的可讀性，可使用“/注釋語(yǔ)句*”進(jìn)行注釋?zhuān)缟厦娴臉邮酱a可添加如下注釋?zhuān)?br/>

P { font-family:"TimesNewRoman";}/*這是CSS注釋文本，有利于方便查找代碼，此文本不會(huì)顯示在瀏覽器窗口中*/

●在CSS代碼中空格是不被解析的，花括號(hào)以及分號(hào)前后的空格可有可無(wú)。因此可以使用空格鍵、Tab鍵、回車(chē)鍵等對(duì)樣式代碼進(jìn)行排版，即所謂的格式化CSS碼，這樣可以提高代碼的可讀性。例如:

代碼段1:

h1{ color: green; font-size: 14px;}

代碼段2:

h1(
    color: green; /*定義顏色屬性*
    font-size: 14px; /*定義字體大小屬性*/
}

上述兩段代碼所呈現(xiàn)的效果是一樣的，但是第二種書(shū)寫(xiě)方式的可讀性更高。需意的是，屬性值和單位之間是不允許出現(xiàn)空格的，否則瀏覽器解析時(shí)會(huì)出錯(cuò)。例如這行代碼就是錯(cuò)誤的。

h1{font-size: 14 px;} /*14和單位px之間有空格，瀏覽器解析時(shí)會(huì)出錯(cuò)*/

推薦了解熱門(mén)學(xué)科