1、字體屬性(type)
font-family(使用什么字體)
font-style(字體的樣式，是否斜體)：normal/italic/oblique
font-variant(字體大小寫)：normal/small-caps
font-weight(字體的粗細(xì))：normal/bold/bolder/lithter
font-size(字體的大小)：absolute-size/relative-size/length/percentage
2、顏色和背景屬性(backgroud)
color(定義前景色，例如：p{color:red})
background-color(定義背景色)
background-image(定義背景圖片)
background-repeat(背景圖案重復(fù)方式)：repeat-x/repeat-y/no-repeat
background-attachment(設(shè)置滾動)：scroll(滾動)/fixe(固定的)
background-position(背景圖案的初始位置)：percentage/length/top/left/right/bottom
3、文本屬性：(block)
定義間距：
word-spacing(單詞之間的距離)
letter-spacing(字母之間的距離)
text-decoration(定義文字的裝飾)：nore/underline/overline/line-through/blink
vertical-align(元素在垂直方向的位置)：baseline(基線)/sub/super/top/text-top/middle/bottom/text-bottom
text-transform(使文本轉(zhuǎn)換為其它方式)：capitalize(大寫)/uppercase(首字母大寫)/lowercase(小寫)/none
text-align(文字的對齊)：left/right/center/justify
text-indent(文本的首行縮進(jìn))length/percentage
line-height(文本的行高):normal/numbet/lenggth/percentage(百分比)
定義超鏈接：
a：link {color:green;text-decoration:nore}(未訪問過的狀態(tài))
a：visited {color:ren;text-decoration:underline;16pt}(訪問過的狀態(tài))
a:hover {color:blue;text-decoration:underline;16pt}(鼠標(biāo)激活的狀態(tài))
4、塊屬性(block)
邊距屬性：
margin-top(設(shè)置頂邊距)
margin-right(設(shè)置右邊距)
margin-bottom(設(shè)置底邊距)
margin-left(設(shè)置左邊距)
填充距屬性：
padding-top設(shè)置頂端真充距)
padding-right設(shè)置頂端真充距)
padding-bottom設(shè)置頂端真充距)
padding-left設(shè)置頂端真充距)
5、邊框?qū)傩?border)
border-top-width(頂端邊框?qū)挾?
border-right-width(右端邊框?qū)挾?
border-bottom-width(底端邊框?qū)挾?
border-left-width(d左邊框?qū)挾?
border-width(一次定義邊框?qū)挾?
border-color(設(shè)置邊框顏色)
border-style(設(shè)置邊框樣式)
border-top(一次定義頂端各種屬性)
border-right(一次定義右端各種屬性)
border-bottom(一次定義底端各種屬性)
border-left(一次定義左端各種屬性)
圖文混排：
width(定義寬度屬性)
height(定義高度屬性)
float(文字環(huán)繞在一個元素的四周)
clear(定義某一邊是否有環(huán)繞)
6、項(xiàng)目符號和編號(list)
display(定義是否顯示)
white-space(怎樣處理空白部分)：normal/pre/nowrap
list-style-type(在列表前加項(xiàng)目符號)disc(圓點(diǎn))/circle(圈)/square（方形）
/decimal（阿拉伯?dāng)?shù)字）/lower-roman(小寫羅馬數(shù)字)/upper-roman(大寫羅馬數(shù)字)/lower-alpha(小寫英文字母)/upper-alpha(大寫英文字母)/nore
list-style-tyle(在列表前加圖案):<url>/none
list-style-position(決定列表項(xiàng)中第二行的起邕位置)
list-style(一次性定義所有屬性)
7、定位（positioning） 即層屬性
Type：設(shè)定對象的定位方式。
有三種方式：Absolute（絕對定位）、Relative（相對定位）、Static（無特殊定位）。相對應(yīng)的CSS屬性是”position”。
Visibility：設(shè)定對象定位層的最初顯示狀態(tài)。有三種狀態(tài)：Inherit（繼承父層的顯示屬性）、Visible（對象可視）、Hidden隱藏對象。相對應(yīng)的CSS屬性是”visibility”。
Z-Index：設(shè)置對象的層疊順序。編號較大的層會顯示在編號較小的層上邊。變量值可以是正值也可以是負(fù)值。相對應(yīng)的CSS屬性是”z-index”。
Overflow：設(shè)置如果層的內(nèi)容超出了層的大小時如何處理。有四種處理方式：visible，增加層的大小，從而將層的所有內(nèi)容顯示出來；hidden，保持層的大小不變，將超出層的內(nèi)容剪裁掉；Scroll，總是顯示滾動；Auto，只有在內(nèi)容超出層的邊界時才顯示滾動條。相對應(yīng)的CSS屬性是”overflow”。 Placement：設(shè)置對象定位層的位置和大小。可以分別設(shè)置left（左邊定位）、top（頂部定位）、width（寬）、height（高）。相對應(yīng)的CSS屬性分別是”left; top; width; height”。Clip：定義定位層的可視區(qū)域。區(qū)域外的部分為不可視區(qū)，為透明的?？梢岳斫鉃樵诙ㄎ粚由戏乓粋€矩形遮罩的效果。相對應(yīng)的CSS屬性是 ”clip”。
8、擴(kuò)展（Extensions）
Pagebreak：在打印的時候強(qiáng)迫在樣式控制的對象前后換頁。
Before：設(shè)置對象前出現(xiàn)的頁分割符。設(shè)置為always時，始終在對象之前插入頁分割符。相對應(yīng)的CSS屬性是”page-break-before”。
After：設(shè)置對象后出現(xiàn)的頁分割符。設(shè)置為always時，始終在對象之后插入頁分割符。相對應(yīng)的CSS屬性是”'>。
注意：以上IE5僅支持always值和空白值（null）。
Cursor：當(dāng)鼠標(biāo)滑過樣式控制的對象時改變鼠標(biāo)形狀?？梢栽O(shè)置為hand（手型）、crosshair（“十”型）、text （“I”型）、wait（等待）、default（默認(rèn)）、help（幫助）、e-resize（東箭頭）、ne-resize（東北箭頭）、n- resize（北箭頭）、nw-resize（西北箭頭）、w-resize（西箭頭）、sw-resize（西南箭頭）、s-resize（南箭頭）、 se-resize（東南箭頭）和auto（自動）。
Filter：在樣式中加上濾鏡特效。由于此屬性內(nèi)容比較多，我們將到下一章單獨(dú)對濾鏡介紹。
1. Alpha：設(shè)置透明度
Alpha(Opacity=?, FinishOpacity=?, Style=?, StartX=?, StartY=?, FinishX=?, FinishY=?)
Opacity：透明度級別，范圍是0-100，0代表完全透明，100代表完全不透明。FinishOpacity：設(shè)置漸變的透明效果時，用來指定結(jié)束時的透明度，范圍也是0 到 100。Style：設(shè)置漸變透明的樣式，值為0代表統(tǒng)一形狀、1代表線形、2代表放射狀、3代表長方形。StartX和StartY：代表漸變透明效果的開始X和Y坐標(biāo)。 FinishX和FinishY：代表漸變透明效果結(jié)束X和Y 的坐標(biāo)。
2. BlendTrans：圖像之間的淡入和淡出的效果
BlendTrans(Duration=?) Duration：淡入或淡出的時間。注意：這個濾鏡必須配合JS建立圖片序列，才能做出圖片間效果。
3. Blru：建立模糊效果
Blur(Add=?, Direction=?, Strength=?) Add：是否單方向模糊，此參數(shù)是一個布爾值，true（非0）或false（0）。 Direction：設(shè)置模糊的方向，其中0度代表垂直向上，然后每45度為一個單位。 Strength：代表模糊的象素值。
4. Chroma：把指定的顏色設(shè)置為透明
Chroma(Color=?) Color：是指要設(shè)置為透明的顏色。
5. DropShadow：建立陰影效果
DropShadow(Color=?, OffX=?, OffY=?, Positive=?) Color：指定陰影的顏色。OffX：指定陰影相對于元素在水平方向偏移量，整數(shù)。 OffY：指定陰影相對于元素在垂直方向偏移量，整數(shù)。 Positive：是一個布爾值，值為true（非0）時，表示為建立外陰影；為false(0)，表示為建立內(nèi)陰影。
6. FlipH：將元素水平反轉(zhuǎn)
7. FlipV：將元素垂直反轉(zhuǎn)
8. Glow：建立外發(fā)光效效果
Glow(Color=?, Strength=?)
Color：是指定發(fā)光的顏色。
Strength：光的強(qiáng)度，可以是1到255之間的任何整數(shù)，數(shù)字越大，發(fā)光的范圍就越大。
9. Gray：去掉圖像的色彩，顯示為黑白圖象
10. Invert：反轉(zhuǎn)圖象的顏色，產(chǎn)生類似底片的效果
11. Light：放置光源的效果，可以用來模擬光源在物體上的投影效果 注意：此效果需要用JS設(shè)置光的位置和強(qiáng)度。
12. Mask：建立透明遮罩
Mask(Color=?) Color：設(shè)置底色，讓對象遮住底色的部分透明。
13. RevealTrans：建立切換效果
RevealTrans(Duration=?, Transition=?)
Duration：是切換時間，以秒為單位。
Transtition：是切換方式，可設(shè)置為從0到23。
注意：如果做頁面間的切換效果，可以在<head>區(qū)加上一行代碼：<Meta http-equiv=Page-enter content=revealTrans(Transition=?,Duration=?) >。如果用在頁面里的元素必須配合JS使用。
14. Shadow：建立另一種陰影效果 Shadow(Color=?, Direction=?) Color：是指陰影的顏色。
Direction：是設(shè)置投影的方向，0度代表垂直向上，然后每45度為一個單位。
15. Wave：波紋效果
Wave(Add=?, Freq=?, LightStrength=?, Phase=?, Strength=?) Add：表示是否顯示原對象，0表示不顯示，非0表示要顯示原對象。 Freq：設(shè)置波動的個數(shù)。LightStrength：設(shè)置波浪效果的光照強(qiáng)度，從0到100。0表示最弱，100表示最強(qiáng)。 Phase：波浪的起始相角。從0到100的百分?jǐn)?shù)值。（例如：25相當(dāng)于90度，而50相當(dāng)于180度。） Strength：設(shè)置波浪搖擺的幅度。
16. Xray：顯現(xiàn)圖片的輪廓，X光片效果
注意：在使用CSS濾鏡時，必須使用在有區(qū)域的元素，比如表格，圖片等。而文本，段落這樣沒有區(qū)域的元素不能使用CSS濾鏡，對這樣的元素我們可以設(shè)置元素的Height和Width樣式或坐標(biāo)來實(shí)現(xiàn)。"
CSS中的長度
絕對單位：幾乎不用在網(wǎng)頁中
in 英寸 1in = 2.54cm
cm 厘米 1cm = 0.394in
pt 磅 1in = 72pt
pc pica 1in = 6pc
相對單位：較常用
em 1em = 相應(yīng)字體的font-size值
ex 1ex = 相應(yīng)字體中的小寫x字母的高度值，較難求得，一般取0.5em
px 最為常用的
CSS中的元素分類
display 設(shè)定元素所屬類別，不可繼承
none(設(shè)定為不顯示在屏幕上)
block(塊級元，包括 P,H1-H6,list,div,body)
inline(內(nèi)聯(lián)元，包括 a,em,span)
list-item(列表元，如 LI)
顏色與背景類
color 設(shè)置文字顏色
#rgb #rrggbb rgb(255,255,255) rgb(100%,100%,100%)
H1{color:red}
H1{color:#f00}
H1{color:#ff0000}
H1{color:rgb(255,0,0)}
H1{color:rgb(100%,0%,0%)}
background-color 設(shè)置背景顏色，格式同上；不可繼承，可用于所有元
BODY{background-color:red}
BODY{background-color:#f00}
BODY{background-color:#ff0000}
BODY{background-color:rgb(255,0,0)}
BODY{background-color:rgb(100%,0%,0%)}
background-image 設(shè)置背景圖片，默認(rèn)為none，不可繼承，可用于所有元
url(imageURL) none
body{backround-image:url(back.jpg);}
background-repeat 設(shè)置背景圖片是否重復(fù)排列，不可繼承，用于所有元
repeat(XY軸均重復(fù)) repeat-x(X軸重復(fù)排列) repeat-y(Y軸重復(fù)排列) No-repeat(不重復(fù)排列，默認(rèn)值)
BODY{background-repeat:repeat-x;}
BODY{background-repeat:No-repeat;}
background-attachment 設(shè)定背景圖片是否卷動，不可繼承，用于所有元
scroll(隨網(wǎng)頁卷動，默認(rèn)值) fixed(不隨網(wǎng)頁卷動)
BODY{background-attachment:fixed;}
background-position 設(shè)定背景圖片或背景顏色開始顯示的位置，不可繼承，用于塊級元和可替換元
top,buttom,left,right,center(用關(guān)鍵字)
70px 10px(用長度值)
50% 30%(用百分比)
BODY{background-position:right top;}
BODY{background-position:50px 10px;}
BODY{background-position:20% 50%;}
background 定義背景綜合屬性，不要求順序，各屬性值以空格分開
BODY{background:#ffcc00 url(bg.jpg) fixed center}
字型類
font-family 設(shè)置字型屬性，取值可以是任何字型名稱，缺省為瀏覽器內(nèi)定字型，可以設(shè)多個以逗號(,)分開，有空格的英文字型可用單引號或雙引號括起來?？衫^承，用于所有元
P{font-family:宋體,楷體,黑體,"Time New Rom";}
font-style 設(shè)定字型樣式，可繼承，用于所有元
Normal(正常，默認(rèn)值) italic(斜體) objlique(直斜體)
P{font-style:italic;}
font-variant 需要特定的字體配合，可繼承，用于所有元
Normal(默認(rèn)) small-caps(如果是中文字型則將字型縮小顯示，如果是英文則全部改為較小的大寫)
H3{font-variant:small-caps;}
font-weight 設(shè)定字體粗細(xì)，可繼承，用于所有元
Normal(默認(rèn)) bold bolder lighter 100 200...900
由于瀏覽器支持程度不同，一般只用normal和bold兩種屬性
P{font-weight:bold;}
font-size 設(shè)定字體的大小，可繼承，用于所有元
絕對大?。簒x-small x-small small medium（默認(rèn)值） large x-large xx-large;
相對大?。簂arger smaller
數(shù)字表示可用單位：磅(pt),像素(px),英寸(in),厘米(cm);
亦可用百分比表示
H2{font-size:36pt;}
P{font-size:200%;}
font 設(shè)定字型的綜合屬性，必須含有字體名稱和字體大小，順序如下
{font-style font-variant font-weight font-size /line-height font-family;} P{bold 12pt/14pt impact,Arial;}
文字類
letter-spacing 設(shè)定文字間距，默認(rèn)為0，可為負(fù)值，可繼承，用于所有元
P{letter-spacing:5pt;}
text-decoration 設(shè)定文字加上下劃線、刪除線等效果，不可繼承，用于所有元
none(無，默認(rèn)值) underline(下劃線) overline(上劃線) line-through(刪除線)
vertical-align 設(shè)定文字或圖片垂直方向的對齊方式
baseline(默認(rèn)值) sub(下標(biāo)) super(上標(biāo)) top(垂直向上對齊) middle(垂直居中) bottom(垂直向下對齊) 百分比(相對于行高，可為負(fù)值)
text-transform 轉(zhuǎn)換英文字母大小寫，可繼承，用于所有元
none(默認(rèn)值) capitalize(首字母大寫) uppercase(所有英文字母大寫) lowercase(所有英文字母小寫)
text-align 設(shè)置文字的水平對齊方式，可繼承，用于塊級元
left(左對齊) right(右對齊) center(水平居中) justify(左右對齊)
text-indent 設(shè)定標(biāo)記元素內(nèi)文字的首行縮進(jìn)或配合margin-left屬性設(shè)定首行凸排，可為負(fù)值，可繼承，用于塊級元
line-height 設(shè)定行高，聲明方式有標(biāo)準(zhǔn)行高、固定值表示法、百分比行高（相對于字體尺寸）、字型大小比例行高等，可繼承，用于所有元
white-space 設(shè)定空白符處理方式，不可繼承，用于塊級元
pre(不忽略塊中的空白符) nowrap(文字不在塊中自動換行) normal(忽略空白符，默認(rèn)值)
列表類
list-style-type 有序列表的編號方式（供標(biāo)記使用），可繼承
none:無編號 decimal:阿拉伯?dāng)?shù)字 lower-roman:小寫羅馬數(shù)字 upper-roman:大寫羅馬數(shù)字 lower-alpha:小寫英文字母 upper-alpha:大寫英文字母
list-style-type 無序列表的符號樣式（供使用），可繼承
none:無符號 disc:實(shí)心圓符號 circle:空心圓符號 square:實(shí)心方形符號
list-style-image 無序列表的自定義符號樣式，可繼承
url(圖片名稱) none(默認(rèn)值)
UL{list-style-imag:url(dd.gif);}
list-style-position 設(shè)置列表清單符號縮排屬性，可繼承
outside(凸排，默認(rèn)值) inside(縮排)
UL{list-style-imag:url(dd.gif); list-style-position:outside;}
list-style 列表清單項(xiàng)目的綜合設(shè)定，屬性之間用空格隔開
UL{list-style-imag:url(dd.gif) inside;}
邊界及其相關(guān)類
margin 標(biāo)記元素邊界值的綜合設(shè)定，可為負(fù)值，不可繼承，用于所有元。應(yīng)用于塊級元時，縱向相鄰邊界被壓縮/重疊；應(yīng)用于內(nèi)聯(lián)元時，不影響文本的行高。
亦可以用margin-top、margin-right、margin-bottom、margin-left分開設(shè)定各邊的邊界。 聲明4個值，其順序?yàn)樯稀⒂?、下、左邊界，如：DIV{margin:12pt 15pt 20pt 16pt;}
聲明3個值，其順序?yàn)樯?、右、下，缺少的左邊界取其對邊（右），如：DIV{margin:12pt 15pt 16pt;}
聲明2個值，其順序?yàn)樯稀⒂?，缺少的下、左邊界取其對邊，如：DIV{margin:12pt 15pt;}
聲明1個值，則4個邊界同一個值，如：DIV{margin:15pt;}
padding 設(shè)定標(biāo)記內(nèi)容與標(biāo)記邊框之間的留白的綜合設(shè)定，不能為負(fù)值，不可繼承，用于所有元。也可分開設(shè)定padding-top、padding-right、padding-bottom、padding-left各值。
border-width 標(biāo)記元素邊框?qū)挾鹊木C合設(shè)定。 也可分開設(shè)定border-top-width、border-right-width、border-bottom-width、border-left-width各值
border-color 標(biāo)記元素邊框顏色的綜合設(shè)定（規(guī)則類似于margin屬性）。顏色取值見color屬性。 也可分開設(shè)定border-top-color、border-right-color、border-bottom-color、border-left-color各值
border-style 標(biāo)記元素邊框樣式的綜合設(shè)定（規(guī)則類似于margin屬性）。邊框樣式有none(默認(rèn)值),dotted,dashed,solid,double,goove,ridge,inset,outset等。 也可分開設(shè)定border-top-style、border-right-style、border-bottom-style、border-left-style各值
border 標(biāo)記元素4個邊框的綜合設(shè)定，可以分別聲明邊框?qū)挾?、邊框樣式、和邊框顏?nbsp;
DIV{border:5pt solid #ff0000;}
width 設(shè)定標(biāo)記元素的寬度
height 設(shè)定標(biāo)記元素的高度
float 設(shè)定標(biāo)記元素與文字間的相對位置（文字繞排方式），不可繼承，用于所有元
none:以默認(rèn)方式顯示
left:標(biāo)記元素靠左，文字在右邊繞排
right:標(biāo)記元素靠右，文字在左邊繞排
clear 設(shè)定標(biāo)記元素與文字間的相對位置（與float不同的是標(biāo)記元素兩邊都不繞排），不可繼承，用于所有元
none:以默認(rèn)方式顯示；
left:標(biāo)記元素靠左，右邊無文字繞排；
right:標(biāo)記元素靠右，左邊無文字繞排；
定位
z-index 設(shè)定標(biāo)記元素的堆疊層次，取值為整數(shù)，也可以是負(fù)數(shù)，數(shù)值大的在上層，不可繼承，用于定位元
visibility 設(shè)定標(biāo)記元素是否可見，不可繼承，用于所有元
inherit:取默認(rèn)值 visible:可見 hidden:不可見（隱藏） collapse
position 設(shè)定定位樣式，不可繼承，用于所有元
static(默認(rèn)值) relative(相對定位) absolute(絕對定位) fixed inherit
