PHP培訓之CSS簡介（二）

CSS基本選擇器

基本選擇器

Style屬性(行內(nèi)樣式)：直接寫在標簽內(nèi)

如：u<p style=”font-size:12px; color:red;” >文字內(nèi)容</p>

標簽選擇器

針對HTML的標簽設(shè)置樣式，這個需要寫在<style>標簽內(nèi)。(biaoqiancss.html)

ID選擇器

ID 選擇器可以為標有特定 ID 的 HTML 元素指定特定的樣式。 根據(jù)元素ID來選擇元素，具有唯一性，這意味著同一id在同一文檔頁面中只能出現(xiàn)一次盡管你會發(fā)現(xiàn)即便你把幾個元素都命名成相同的id名字，css選擇器還是會把這些元素都選中應(yīng)用樣式，對于css選擇器，id屬性的唯一性似乎不存在。然而，對于js而言，它只會選擇具有相同id名字元素中的第一個。出于一個好的編程習慣，同一個id不要在頁面中出現(xiàn)第二次。

語法：以”#”開頭

使用方法：<p id=”id的名稱”></p>

類選擇器

語法：以”.”開頭，后面跟類名

使用方法：<p class=”類名”>內(nèi)容</p>

通配符選擇器

針對當前頁面所用的標簽應(yīng)用同樣的樣式(對標簽的初始化)

*{CSS規(guī)則}

如：*{margin:0;padding:0;border:0;}

標簽和類結(jié)合

如：p.test{color:red}=>針對p標簽應(yīng)用類名為test的樣式

組合選擇器

多元素選擇器

多個標簽或選擇器同時聲明。

如：h1,h2,ul,li{margin:0;padding:0;}

定義的方法：選擇器之間用逗號隔開

后代選擇器

后代選擇器也稱為包含選擇器，用來選擇特定元素或元素組的后代，將對父元素的選擇放在前面，對子元素的選擇放在后面，中間加一個空格分開。后代選擇器中的元素不僅僅只能有兩個，對于多層祖先后代關(guān)系，只要對祖先元素的選擇在后代元素之前、中間以空格分開即可。

例如：p空格span{color:red;}

子元素選擇器

請注意這個選擇器與后代選擇器的區(qū)別，子選擇器（child selector）僅是指它的直接后代，或者你可以理解為作用于子元素的第一個后代。而后代選擇器是作用于所有子后代元素。后代選擇器通過空格來進行選擇，而子選擇器是通過“>”進行選擇。

例如：p>span{color:red;}

只會針對p標簽內(nèi)的第一級span標簽有效

偽類選擇器

有時候還會需要用文檔以外的其他條件來應(yīng)用元素的樣式，比如鼠標懸停等。這時候我們就需要用到偽類了。

如：<a href=”#”></a>

A:link鏈接的政策狀態(tài)

A:visited鼠標單擊過的鏈接狀態(tài)

A:hover鼠標放在鏈接上面的(懸停)狀態(tài)

A:active當前正在訪問的鏈接狀態(tài)