1 字體屬性
font-family :"Lucida Grande", Verdana, Lucida, Arial, Helvetica, 宋體,sans-serif; (所有字體)
font-style:normal;italic;oblique
font-variant:normal;small-caps
font-weight:normal;bold;bolder;lithter
font-size:absolute-size relative-size 長度值和百分數
2 顏色和背景屬性
color:red；yellow (顏色)定義前景色
background-color:yellow(顏色)定義背景色
background-image:url(.../*.jpg)圖片路徑
background-repeat:repeat-x;repeat-y;no-repeat
background-attachment:scroll;fixed設置滾動
background-position:top;left;right;bottom;長度和百分數
3 文本屬性
word-spacing:normal;長度（定義了各單詞之間的間距）
letter-spacing:同上
text-decoration:none;underline;overline;line-through;bink定義字體的裝飾
vertical-align:baseline;sub;super;top;text-top;middle;bottom;text-bottom定義元素在垂直方向上的位置
text-transform:capitalize;uppercase;lowercase;none使文本轉換為其他形式
text-align:left;right;center;justify(文字分散對齊)定義了文字的對齊方式
text-indent:長度和百分數
line-height:normal;數字和長度和百分數
4 邊距屬性
margin-top:長度和百分數和auto 設置頂端邊距
margin-right
margin-bottom
margin-left
5 填充距屬性
padding-top:長度和百分數 設置頂端填充距
padding-right
padding-bottom
padding-left
6 邊框屬性
border-top-width:thin;medium;thick;長度 設置頂端邊框寬度
border-right-width
border-bottom-width
border-left-width
border-width 一次性定義邊距的寬度
border-color:顏色
border-style:none;dotted;dash;solid;double;groove;ridge;inset;outsetsolid /*實線框*/
· ? ? dotted /*虛線框*/
· ? ? double /*雙線框*/
· ? ? groove /*立體內凸框*/
· ? ? ridge /*立體浮凸框*/
· ? ? inset /*凹框*/
· ? ? outset /*凸框*/
border-rop:border-top-width|border-style|color一次性定義頂端的各種屬性
border-right
border-bottom
border-left
7 圖文混排
width:長度和百分數auto 定義寬度屬性
height:長度;auto
float:left;right;none使文字環繞在一個元素的四周
clear:left;right;none;both定義某一邊是否有環繞文字
8 分級屬性
display:block;inline;list-item;none定義是否顯示
white-space:normal;pre;nowrap決定怎樣處理空白部分
list-style-type:disc;circle;square;decimal;lower-roman;upper-roman;lower-alpha;upper-alpha;none
list-style-image:url(.../*.jpg);none在列表項前加圖案
list-style-position:inside;outside決定列表項中第二行的起始位置
list-style:keyword|position|url一次性定義前面的列表屬性
· ? ? list-style-type:none; /*不編號*/
· ? ? list-style-type:decimal; /*阿拉伯數字*/
· ? ? list-style-type:lower-roman; /*小寫羅馬數字*/
· ? ? list-style-type:upper-roman; /*大寫羅馬數字*/
· ? ? list-style-type:lower-alpha; /*小寫英文字母*/
· ? ? list-style-type:upper-alpha; /*大寫英文字母*/
· ? ? list-style-type:disc; /*實心圓形符號*/
· ? ? list-style-type:circle; /*空心圓形符號*/
· ? ? list-style-type:square; /*實心方形符號*/
· ? ? list-style-image:url(dot.gif); /*圖片式符號*/
· ? ? list-style-position:outside; /*凸排*/
· ? ? list-style-position:inside; /*縮排*/
9 鼠標屬性
cursor:
auto自動，按照默認狀態自行改變
crosshair精確定位“十”字
default默認指針
hand手形
move移動
e-resize箭頭朝右方
ne-resize箭頭朝右上方
nw-resize箭頭朝左上方
n-resize箭頭朝上方
se-resize箭頭朝右下方
sw-resize箭頭朝左下方
s-resize箭頭朝下方
w-resiz箭頭朝左方
text文本形
wait等待
help幫助
使用圖案鼠標光標例如:
body {cursor:url("mything.cur"),url("mything.cur"),text;}
當無法處理光標名單的第一個光標,則會以第二個光標代替
若無法處理任何定義的光標,最后便以一般光標text顯示 (圖案鼠標光標寫法是W3C發布的標準)
9 css定位
position:absolute;relative;static定義位置
left.top:長度和百分數auto指定橫向，縱向坐標位置
width.height:指定占用空間的大小
clip:shape|auto剪切
overflow:visible;hidden;scroll;auto內容超出時的處理辦法
例子：CSS中的textOverflow屬性可以將過多的文字用省略號進行表示，語法如下：
<SPAN style="width:100px;overflow:hidden;text-overflow:ellipsis;">
<NOBR>text to display</NOBR>
</SPAN>
其中overflow必須設置為hidden
z-index:auto;integer產生立體效果
visibility:inherit;visible;hidden定義可見性
10 css濾鏡
（1）alpha是來設置透明度的。先來看一下它的表達格式：
filter：alpha（opacity=opcity，finishopacity=finishopacity，
style=style，startX=startX，startY=startY，finishX=finishX，
finishY=finishY）
Opacity代表透明度等級，可選值從0到100，0代表完全透明，100代表完全不透明。 Style參數指定了透明區域的形狀特征。其中0代表統一形狀；1代表線形；2代表放射狀；3代表長方形。
Finishopacity是一個可選項，用來設置結束時的透明度，從而達到一種漸變效果，它的值也是從0到100。 StartX和StartY代表漸變透明效果的開始坐標，finishX和finishY代表漸變透明效果的結束坐標。
blur是來設置模糊的。先來看一下它的表達格式：
（2）filter：blur（add=add，direction，strength=strength）
? 我們看到blur屬性有三個參數：add、direction、strength。
Add參數有兩個參數值：true和false。意思是指定圖片是否被改變成模糊效果。 Direction參數用來設置模糊的方向。模糊效果是按照順時針方向進行的。其中0度代表垂直向上，每45度一個單位，默認值是向左的270度。Strength參數值只能使用整數來指定，它代表有多少像素的寬度將受到模糊影響。默。認值是5像素
（3）Chroma屬性可以設置一個對象中指定的顏色為透明色，它的表達式如下：
Filter：Chroma（color=color）
（4）Filter：DropShadow（Color=color，Offx=Offx，Offy=offy，Positive=positive）
該屬性一共有四個參數： Color代表投射陰影的顏色。 Offx和offy分別X方向和Y方向陰影的偏移量。偏移量必須用整數值來設置。如果設置為正整數，代表X軸的右方向和Y軸的向下方向。設置為負整數則相反。Positive參數有兩個值：True為任何非透明像素建立可見的投影，False為透明的像素部分建立可見的投影。
（5）Flip是CSS濾鏡的翻轉屬性，FlipH代表水平翻轉，FlipV代表垂直翻轉。它們的表達式很簡單，分別是：
Filter：FlipH
Filter：FlipV
（6）Filter：Glow（Color=color，Strength=strength）
Glow屬性的參數只有兩個：Color是指定發光的顏色，Strength指定發光的強度，參數值從1到255。
（7）Invert屬性可以把對象的可視化屬性全部翻轉，包括色彩、飽和度和亮度值。
它的表達式也很簡單：
Filter：Invert
（8）Mask屬性為對象建立一個覆蓋于表面的膜。它的表達式也很簡單：
Filter：Mask（Color=顏色）
（9）Shadow屬性可以在指定的方向建立物體的投影。它的表達式是這樣的：
Filter：Shadow（Color=color，Direction=direction）
在這里，Shadow有兩個參數值：Color參數用來指定投影的顏色；Direction參數用來指定投影的方向
（10）Filter：Wave（Add=True（False），Freq=頻率，LightStrength=增強光效，
Phase=偏移量，Strength=強度）
我們看到Wave屬性的表達式還是比較復雜的，它一共有五個參數。Add參數有兩個參數值：True代表把對象按照波紋樣式打亂；False代表不打亂；
Freq參數指生成波紋的頻率，也就是指定在對象上共需要產生多少個完整的波紋。 LightStrength參數是為了使生成的波紋增強光的效果。參數值可以從0到100。 Phase參數用來設置正弦波開始的偏移量。這個值的通用值為0，它的可變范圍為從0到100。這個值代表開始時的偏移量占波長的百分比。比如該值為25，代表正弦波從90度（360*25%）的方向開始。
（11）Xray就是X射線的意思。
Xray屬性，顧名思義，這種屬性產生的效果就是使對象看上去有一種X光片的感覺。 它的表達式很簡單：
Filter：Xray