CSS
Css 層疊樣式表
將網頁中的樣式分離出來,完全由css來控制
增強樣式的複用性以及可擴展性。
格式:
選擇器{屬性名:屬性值;屬性名:屬性值…}
Css和html代碼相結合的四種方式:
1. 每一個html標籤都有一個style屬性。
2. 當頁面有多個標籤有相同樣式時,可以進行復用。
<style>
Css代碼
</style>
3. 當有多個頁面中的標籤的樣式相同時,還可以將樣式單獨封裝成一個css文件。通過在每個頁面中定義。
<style>
@ import url(“1.css”);
</style>
4. 通過html中head標籤中的link標籤連接一個css文件。
<link rel=”stylesheet”href=1.css”/>
技巧:爲了提高相同的樣式的複用性以及擴展性,可以將多個標籤樣式進行單獨定義,並封裝成css文件。P.css,div.css…
在一個css文件中使用的import將多個標籤樣式文件導入。
然後再html頁面上,使用linl標籤導入這個總的css文件即可。
1.css
@import url(“p.css”);
@import url(“div.css”);
<link rel=”stylesheet” href=”1.css”/>
----------------------------------------------------------------------------------------------------------------
選擇器:其實即使樣式要作用的標籤容器。
當樣式分離後,html作用在於用標籤封裝數據,然後將css加載到指定標籤上。
選擇器的基本分類:
1. 標籤選擇器:其實就是html中的每一個標籤名。
2. 類選擇器:其實就是每一個標籤中的class屬性。用.的形式表示。
只用來給css所使用。可以對不同標籤進行相同樣式設定。
3. ID選擇器:其實就是每一個標籤中的ID屬性。但是要保證ID唯一性。用#來表示。
ID不僅可以被css所使用,還可以被javascript所使用。
選擇器優先級:ID>class>標籤
擴展選擇器:
1. 關聯選擇器:其實就是對標籤中的biaoq進行樣式定義。選擇器選擇器。。。
2. 組合選擇器:對多個選擇器進行相同樣式定義。將多個選擇器通過,隔開的形式。
3. 僞元素選擇器:其實就是元素說的一種狀態。
a:link 超鏈接被點前狀態。
a:visited 超鏈接點擊後狀態。
a:hover 懸停在超連接上。
a:active 點擊超連接時。在定義這些狀態時,有一個順序:L V H A
p:first-letter
p:first-llne
:foucs:很遺憾,IE6不支持。但FF支持。
css濾鏡:其實通過一些代碼完成豐富了樣式。
當使用到css的更多屬性時,還需要查閱css api。
網頁設計的時候。div+css。
div:行級區域
span:塊級區域
p:行級區域。p中不要嵌套div。