CSS樣式

層疊樣式表

1.css也是標記語言，設定HTML頁面中的文字內容,圖片的外形以及版面的排版顯示，css 頁面的佈局更靈活
2.樣式規則：
兩部分組成：選擇器 {宣告}
3.選擇器：

• 用於指定CSS樣式的HTML標籤，花括號內是對這個物件設定的具體的樣式
• 屬性和屬性值 鍵值對出現
• 字型大小 文字顏色
• 屬性和屬性值之間使用：分開
• 多個宣告之間使用;分開
• 所有的樣式，都包含在style標籤內，表示的是樣式表，style一般在</head/ >上面

強制推薦使用選擇器，屬性名，屬性值關鍵字全部使用小寫字母，特殊情況除外

行內CSS+內部CSS+外部CSS

效果

CSS寫法優缺點

1. 行內CSS，書寫方便。侷限性太大，只能控制這個標籤自身。而且無法實現樣式和結構的分離
2. 內部CSS，可以掌控整個html的內部標籤，僅侷限於當前HTML，但是無法實現樣式和結構的徹底分離
3. 外部CSS，書寫繁瑣。沒有侷限性，只要是哪個HTML需要裡面的樣式都可以引用，實現了結構和樣式的徹底分離

總結：

1. 這三種樣式都可以使用
2. 論控制範圍：外部CSS>內部CSS>行內CSS
3. 使用頻率：工作(外部CSS)，學習(內部CSS)

樣式格式的組成：

1. 選擇器：選擇標籤的一個工器
2. 樣式屬性以及屬性值以鍵值對形式書寫(屬性:屬性值;)

注意：標籤屬性和樣式屬性的區分

• 標籤屬性：這個標籤自身具有的一些特徵
• 標籤屬性：這個標籤自身具有的一些特徵

選擇器

• 基礎選擇器
• 複合選擇器

基礎選擇器

標籤選擇器

直接使用標籤的名稱作為選擇器進行使用，可以使用標籤選擇器選擇一個HTML中的所有該標籤

標籤名{
	樣式內容
}

類選擇器

類是指分類，將具有相同樣式的標籤先全部劃分為一類，給所有這類標籤使用class屬性設定同一個類名，然後在css裡面使用.類名作為選擇器

.類名{}
	樣式內容

多類名選擇器

給一個標籤可以設定多個class值，這多個class值之間使用空格隔開，寫樣式可以給這個標籤具有的任何一個類名書寫都能作用到，但是相同的樣式屬性哪個類名在後面以哪個為主。

<標籤 class="類名1 類名2 ...."></標籤>

Id選擇器

給某個標籤設定一個Id屬性，然後在CSS中使用#Id名作為選擇器。注意，因為同一個html檔案中所有標籤Id的唯一性，導致Id選擇器只能控制一個標籤的樣式，和行內標籤作用類似。

#Id名{
	樣式內容
}

萬用字元選擇器

使用*作為選擇器可以選擇中，這個HTML中的所有標籤，謹慎使用。

 *{
            樣式內容
        }

總結

萬用字元>類選擇器>標籤選擇器>Id選擇器

注意！
在使用class或者Id的時候，命名規範明確，不能直接使用標籤名稱或者一些特殊的關鍵字，以字母或_開頭，大小寫嚴格區分。在命名時見名思意