CSS 層疊樣式表:
將網頁中的樣式分離出來,完全有CSS來控制.增強楊思的複用性及可擴展性.
格式:
選擇器{屬性名:屬性值;...}
一、css和html代碼結合的四種方式:
1,每一個html標籤都有個style屬性.
2,當頁面有多個標籤有相同樣式時,可以進行復用,在html的head部分定義style標籤,並嵌入css帶按摩.
<style>
css代碼.
</style>
3,當有多個頁面中的標籤有相同樣式時,可以講樣式單獨封裝成一個css文件,通過在每個頁面中定義:
<style>
@import
url("1.css");
</style>
將css文件加載到頁面.
4,通過html中的head標籤中的link標籤連接一個css文件.
<link
rel=""stylesheet href="1.css" />
使用技巧:可以講多個css樣式(文件)加載到一個css文件(如:manage.css)中,只要在html頁面中加載這個manage.css即可.可以直接對這個css文件進行管理,而不需要調整html代碼.
例如: 有兩個樣式表:a.css,
b.css.
在html中加載1.css即可,而1.css只需要導入這兩個文件.
@import
url("a.css")
@import
url("b.css")
二、選擇器:css樣式作用的標籤容器.
當樣式分離後,html作用在於用標籤封裝數據,然後將css加載進來租用於指定標籤上.
(一)選擇器的分類:
1,標籤選擇器:就是html中的每一個標籤名.
2,類選擇器:就是每一個標籤中的class屬性,用.的形式來標示.
只對css所使用,可以給不同的標籤盡心相同的樣式設定.
3,ID選擇器:其實就是每一個標籤中的ID屬性,但是要保證ID的唯一性,用#來標示.
ID屬性不僅可以被css使用,還可以被javascript使用.
選擇器的優先級:ID>class>標籤.
(二)擴展選擇器:
1、關聯選擇器:就是對標籤中的標籤進行樣式定義.
格式:選擇器
選擇器 ...
2、組合選擇器:對多個選擇器進行相同的樣式定義,將多個選擇器通過,隔開.
3、爲元素選擇器:其實就是元素的一種狀態.
a:link——超鏈接被點前的狀態.
a:visited——超鏈接點擊後的狀態.
a:hover——鼠標懸停在超鏈接上的狀態
a:active——點擊超鏈接時.
p:first-letter——首字母
P:first-line——首行
:focus——獲得焦點時.
css濾鏡:通過一些代碼豐富了樣式.
css幫助文檔.