| 屬 性 名 稱 |
屬性功能及其取值 |
用 法 說 明 與 范 例 |
| 顏色與背景類 |
| 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è)置背景圖片,，
url(/imageURL) |
body{backround-image:url(/back.jpg);} |
| background-repeat |
設(shè)置背景圖片是否重復(fù)排列:
repeat-x(X軸重復(fù)排列);
repeat-y(Y軸重復(fù)排列);
No-repeat(不重復(fù)排列) |
BODY{background-repeat:repeat-x;}
BODY{background-repeat:No-repeat;} |
| background-attachment |
設(shè)定背景圖片是否卷動(dòng),，默認(rèn)為卷動(dòng)。
scroll(卷動(dòng))
fixed(不卷動(dòng)) |
BODY{background-attachment:fixed;} |
| background-position |
設(shè)定背景圖片或背景顏色開始顯示的位置,，取值格式：
top,buttom,left,right,center(用關(guān)鍵字)
70px 10px(用長(zhǎng)度值)
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è)多個(gè)以逗號(hào)(,)分開,，有空格的英文字型可用單引號(hào)或雙引號(hào)括起來。 |
P{font-family:宋體,楷體,黑體,"Time New Rom";} |
| font-style |
設(shè)定字型樣式：Normal(正常),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,lighter,border,100,200...900
由于瀏覽器支持程度不同,，一般只用normal和bold兩種屬性。 |
P{font-weight:bold;} |
| font-size |
設(shè)定字體的大??；
絕對(duì)大小：xx-small,x-small,small,mediumlarge,x-large,xx-large;
相對(duì)大?。簂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è)定文字間距,。 |
P{letter-spacing:5pt;} |
| text-decoration |
設(shè)定文字加上下劃線,、刪除線等效果：
none(無(wú))
underline(下劃線)
overline(上劃線)
line-through(刪除線) |
|
| vertical-align |
設(shè)定文字或圖片垂直方向的對(duì)齊方式：
baseline:默認(rèn)值 sub:下標(biāo) super:上標(biāo) top:垂直向上對(duì)齊 middle:垂直居中 bottom:垂直向下對(duì)齊,。 |
|
| text-transform |
轉(zhuǎn)換英文字母大小寫：
none:默認(rèn)值 capitalize:首字母大寫 uppercase:所有英文字母大寫 lowercase:所有英文字母小寫。 |
|
| text-align |
設(shè)置文字的水平對(duì)齊方式：
left:左對(duì)齊 right:右對(duì)齊 center:水平居中 justify:左右對(duì)齊,。 |
|
| text-indent |
設(shè)定標(biāo)記元素內(nèi)文字的首行縮進(jìn)或配合margin-left屬性設(shè)定首行凸排,。 |
|
| line-height |
設(shè)定行高，聲明方式有標(biāo)準(zhǔn)行高,、固定值表示法,、百分比行高、字型大小比例行高等,。 |
|
| 列表類 |
| list-style-type |
有序列表的編號(hào)方式（供<OL>標(biāo)記使用）：
none:無(wú)編號(hào) decimal:阿拉伯?dāng)?shù)字 lower-roman:小寫羅馬數(shù)字 upper-roman:大寫羅馬數(shù)字 lower-alpha:小寫英文字母 upper-alpha:大寫英文字母,。 |
|
| list-style-type |
無(wú)序列表的符號(hào)樣式（供<UL>使用）：
none:無(wú)符號(hào) disc:實(shí)心圓符號(hào) circle:空心圓符號(hào) square:實(shí)心方形符號(hào)。 |
|
| list-style-image |
無(wú)序列表的自定義符號(hào)樣式：
格式：url(圖片名稱) |
UL{list-style-imag:url(/dd.gif);} |
| list-style-position |
設(shè)置列表清單符號(hào)縮排屬性：
outside:凸排 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è)定。（其規(guī)則見右邊范例）
亦可以用margin-top,、margin-right,、margin-bottom、margin-left分開設(shè)定各邊的邊界,。 |
聲明4個(gè)值,，其順序?yàn)樯稀⒂?、下,、左邊界，如：DIV{margin:12pt 15pt 20pt 16pt;}
聲明3個(gè)值,，其順序?yàn)樯?、右、下,，缺少的左邊界取其?duì)邊（右）,，如：DIV{margin:12pt 15pt 16pt;}
聲明2個(gè)值，其順序?yàn)樯?、右，缺少的下,、左邊界取其?duì)邊,，如：DIV{margin:12pt 15pt;}
聲明1個(gè)值，則4個(gè)邊界同一個(gè)值,，如：DIV{margin:15pt;} |
| padding |
設(shè)定標(biāo)記內(nèi)容與標(biāo)記邊框之間的留白的綜合設(shè)定（規(guī)則見margin屬性的范例）,。 |
也可分開設(shè)定padding-top、padding-right,、padding-bottom,、padding-left各值,。 |
| border-width |
標(biāo)記元素邊框?qū)挾鹊木C合設(shè)定（規(guī)則類似于margin屬性）。 |
也可分開設(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屬性）,。邊框樣式有solid,double,goove,ridge,inset,outset等。 |
也可分開設(shè)定border-top-style,、border-right-style,、border-bottom-style、border-left-style各值,。 |
| border |
標(biāo)記元素4個(gè)邊框的綜合設(shè)定,，可以分別聲明邊框?qū)挾取⑦吙驑邮?、和邊框顏色?/td>
| DIV{border:5pt solid #ff0000;} |
| width |
設(shè)定標(biāo)記元素的寬度,。 |
|
| height |
設(shè)定標(biāo)記元素的高度。 |
|
| float |
設(shè)定標(biāo)記元素與文字間的相對(duì)位置（文字繞排方式）,。取值：
none:以默認(rèn)方式顯示,；
left:標(biāo)記元素靠左，文字在右邊繞排,；
right:標(biāo)記元素靠右,，文字在左邊繞排； |
|
| clear |
設(shè)定標(biāo)記元素與文字間的相對(duì)位置（與float不同的是標(biāo)記元素兩邊都不繞排）,。取值：
none:以默認(rèn)方式顯示,；
left:標(biāo)記元素靠左，右邊無(wú)文字繞排,；
right:標(biāo)記元素靠右,，左邊無(wú)文字繞排； |
|
| 其他類 |
| z-index |
設(shè)定標(biāo)記元素的堆疊層次,，取值為整數(shù),，也可以是負(fù)數(shù)，數(shù)值大的在上層,。 |
|
| visibility |
設(shè)定標(biāo)記元素是否可見,，取值有：
inherit:取默認(rèn)值 visible:可見 hidden:不可見（隱藏） |
|
