python 守護程序
阿新 • • 發佈：2020-12-12
Css基本語法結構
一、概述
- CSS是指層疊樣式表（Cascading Style sheets）;
- 樣式定義如何顯示HTML元素；
- 樣式通常存在樣式表中；
二、選擇器
語法
- 選擇器（selector）{樣式名稱1：值；
樣式名稱2：值；
…
}
-
注意事項：
-
書寫位置：頭部標籤之中，style標籤之內；
-
值如果是多個單詞，需要加雙引號；
-
屬性分行描述，增加可讀性；
分類
-
標籤選擇器：直接以標籤名當作選擇器，所有該標籤都會擁有此樣式；
-
ID選擇器：#ID{ }
<style> #p2{ color:blue; } </style> <body> <p id="p2"> 文字 </p> </body>注意：ID名不要以數字開頭。
-
類選擇器：標籤內加Class，語法：.類名稱{ }
<style>
.p1{
color:blue;
}
</style>
<body>
<p class="p1">
文字
</p>
</body>
複合選擇器
-
後代選擇器
外層元素選擇器 內層元素選擇器 { … }
-
交集選擇器
有兩個選擇器構成，第一個必須是標籤選擇器，第二個必須是id或者類選擇器，兩個選擇器直接連在一起，中間沒有任何字元。
- 並集選擇器
逗號間隔多個基本選擇器，給多個元素設定同樣的樣式。
三、CSS樣式的引入
行內樣式（不建議使用）
在標籤名上新增style屬性，不建議使用。
<p style="color:red">文字</p>
內部樣式表
head中新增style標籤來書寫樣式。
外部樣式表（推薦使用）
把CSS程式碼單獨書寫在一個.CSS檔案中，然後引入到HTML當中。
建議HTML檔案與CSS檔案同名。
方法：在HTML頭部標籤中使用標籤
優點：
- HTML檔案和CSS檔案完全分離，易於維護；
- 單獨的樣式檔案會在瀏覽器中快取，一定程度上提高網頁的訪問速度。
四、CSS的繼承特性
子標籤可以繼承父標籤的樣式風格，子標籤的樣式不會影響父標籤的樣式風格。
五、CSS的優先順序
- ID選擇器>類選擇前期>標籤選擇器；
- 行內樣式>內部樣式表>外部樣式表；
四、CSS的繼承特性
子標籤可以繼承父標籤的樣式風格，子標籤的樣式不會影響父標籤的樣式風格。
五、CSS的優先順序
- ID選擇器>類選擇前期>標籤選擇器；
- 行內樣式>內部樣式表>外部樣式表；
- ！important 提升優先順序。