CSS用戶手冊(cè)(已精心整理)

1、一、CSS背景屬性（Background）background簡寫屬性在一個(gè)聲明中設(shè)置所有的背景屬性。backgroud:background-color;background-image;background-repeat;background-attachment;background-position;background-color:redrgb(255,255,255)#000000設(shè)置背景顏色background-image：url(bgimage.gif);（值為圖片的路徑）設(shè)置背景圖像background-repeat：設(shè)置圖像的排列repeat默認(rèn)。背景圖像將在垂直方向和水平

2、方向重復(fù)。repeat-x背景圖像將在水平方向重復(fù)。repeat-y背景圖像將在垂直方向重復(fù)。no-repeat背景圖像將僅顯示一次。inherit規(guī)定應(yīng)該從父元素繼承background-repeat屬性的設(shè)置。background-attachment：設(shè)置背圖像是否固定或者隨著頁面的其余部分滾動(dòng)。scroll默認(rèn)值。背景圖像會(huì)隨著頁面其余部分的滾動(dòng)而移動(dòng)。fixed當(dāng)頁面的其余部分滾動(dòng)時(shí)，背景圖像不會(huì)移動(dòng)。inherit規(guī)定應(yīng)該從父元素繼承background-attachment屬性的設(shè)置。background-position：topleft;x%y%;5px50px設(shè)置背景圖像的起

3、始位置。景二、CSS邊框?qū)傩裕˙order和Outline）border：簡寫屬性在一個(gè)聲明設(shè)置所有的邊框?qū)傩詁order:border-width;border-color;border-style;border-width:設(shè)置邊框?qū)挾?thin定義細(xì)的邊框*medium默認(rèn)。定義中等的邊框。*thick定義粗的邊框。*length允許您自定義邊框的寬度。(15px)*inherit規(guī)定應(yīng)該從父元素繼承邊框?qū)挾?。border-color:設(shè)置邊框顏色*color_name規(guī)定顏色值為顏色名稱的邊框顏色（比如red）。*hex_number規(guī)定顏色值為十六進(jìn)制值的邊框顏色（比如#ff0000

4、）。*rgb_number規(guī)定顏色值為rgb代碼的邊框顏色（比如rgb(255,0,0)）。*transparent默認(rèn)值。邊框顏色為透明。*inherit規(guī)定應(yīng)該從父元素繼承邊框顏色。border-style:設(shè)置邊框樣式*none定義無邊框。*hidden與none相同。不過應(yīng)用于表時(shí)除外，對(duì)于表，hidden用于解決邊框沖突。*dotted定義點(diǎn)狀邊框。在大多數(shù)瀏覽器中呈現(xiàn)為實(shí)線。*dashed定義虛線。在大多數(shù)瀏覽器中呈現(xiàn)為實(shí)線。*solid定義實(shí)線。*double定義雙線。雙線的寬度等于border-width的值。*groove定義3D凹槽邊框。其效果取決于border-color

5、的值。*ridge定義3D壟狀邊框。其效果取決于border-color的值。*inset定義3Dinset邊框。其效果取決于border-color的值。*outset定義3Doutset邊框。其效果取決于border-color的值。*inherit規(guī)定應(yīng)該從父元素繼承邊框樣式。-border-bottom簡寫屬性把下邊框的所有屬性設(shè)置到一個(gè)聲明中.-border-top/right/bottom/leftborder-bottom:border-bottom-width;border-bottom-style;border-bottom-color;-border-style/width

6、/color:outline（輪廓）是繪制于元素周圍的一條線，位于邊框邊緣的外圍，可起到突出元素的作用。注釋：輪廓線不會(huì)占據(jù)空間，也不一定是矩形。outline:outline-color;outline-style;outline-width;三、CSS文本屬性（Text）color：設(shè)置文本顏色direction：設(shè)置文本的方向/書寫方向*ltr默認(rèn)。文本方向從左到右。*rtl文本方向從右到左。*inherit規(guī)定應(yīng)該從父元素繼承direction屬性的值。letter-spacing：設(shè)置字符間距*normal默認(rèn)。規(guī)定字符間沒有額外的空間。*length定義字符間的固定空間（允許使用負(fù)

7、值）。*inherit規(guī)定應(yīng)該從父元素繼承l(wèi)etter-spacing屬性的值。line-height：設(shè)置（行高）*normal默認(rèn)。設(shè)置合理的行間距。*number設(shè)置數(shù)字，此數(shù)字會(huì)與當(dāng)前的字體尺寸相乘來設(shè)置行間距。*length設(shè)置固定的行間距。*%基于當(dāng)前字體尺寸的百分比行間距。*inherit規(guī)定應(yīng)該從父元素繼承l(wèi)ine-height屬性的值。text-align:文本的水平對(duì)齊方式。*left把文本排列到左邊。默認(rèn)值：由瀏覽器決定。*right把文本排列到右邊。*center把文本排列到中間。*justify實(shí)現(xiàn)兩端對(duì)齊文本效果。*inherit規(guī)定應(yīng)該從父元素繼承text-ali

8、gn屬性的值。 HYPERLINK /css/pr_text_text-decoration.asp text-decoration規(guī)定添加到文本的裝飾效果。*none默認(rèn)。定義標(biāo)準(zhǔn)的文本。*underline定義文本下的一條線。*overline定義文本上的一條線。*line-through定義穿過文本下的一條線。*blink定義閃爍的文本。*inherit規(guī)定應(yīng)該從父元素繼承text-decoration屬性的值。 HYPERLINK /css/pr_text_text-indent.asp text-indent規(guī)定文本塊首行的縮進(jìn)*length定義固定的縮進(jìn)。默認(rèn)值：0。*%定義基于父

9、元素寬度的百分比的縮進(jìn)。*inherit規(guī)定應(yīng)該從父元素繼承text-indent屬性的值。text-transform控制文本的大小寫。*none默認(rèn)。定義帶有小寫字母和大寫字母的標(biāo)準(zhǔn)的文本。*capitalize文本中的每個(gè)單詞以大寫字母開頭。*uppercase定義僅有大寫字母。*lowercase定義無大寫字母，僅有小寫字母。*inherit規(guī)定應(yīng)該從父元素繼承text-transform屬性的值。text-shadow規(guī)定添加到文本的陰影效果。 HYPERLINK /css/pr_unicode-bidi.asp unicode-bidi設(shè)置文本方向。white-space屬性設(shè)置如

10、何處理元素內(nèi)的空白*normal默認(rèn)?？瞻讜?huì)被瀏覽器忽略。*pre空白會(huì)被瀏覽器保留。其行為方式類似HTML中的標(biāo)簽。*nowrap文本不會(huì)換行，文本會(huì)在在同一行上繼續(xù)，直到遇到標(biāo)簽為止。*pre-wrap保留空白符序列，但是正常地進(jìn)行換行。*pre-line合并空白符序列，但是保留換行符。*inherit規(guī)定應(yīng)該從父元素繼承white-space屬性的值。word-spacing屬性增加或減少單詞間的空白（即字間隔）*normal默認(rèn)。定義單詞間的標(biāo)準(zhǔn)空間。*length定義單詞間的固定空間。*inherit規(guī)定應(yīng)該從父元素繼承word-spacing屬性的值。四、CSS字體屬性（Font）

11、font:font-style;font-variant;font-weight;font-style:規(guī)定字體樣式*normal默認(rèn)值。瀏覽器顯示一個(gè)標(biāo)準(zhǔn)的字體樣式。*italic瀏覽器會(huì)顯示一個(gè)斜體的字體樣式。*oblique瀏覽器會(huì)顯示一個(gè)傾斜的字體樣式。*inherit規(guī)定應(yīng)該從父元素繼承字體樣式。font-variant:規(guī)定字體異體*normal默認(rèn)值。瀏覽器會(huì)顯示一個(gè)標(biāo)準(zhǔn)的字體。*small-caps瀏覽器會(huì)顯示小型大寫字母的字體。*inherit規(guī)定應(yīng)該從父元素繼承font-variant屬性的值。font-weight屬性設(shè)置文本的粗細(xì)*normal默認(rèn)值。定義標(biāo)準(zhǔn)的字符。*

12、bold定義粗體字符。*bolder定義更粗的字符。*lighter定義更細(xì)的字符。*100-900*inherit規(guī)定應(yīng)該從父元素繼承字體的粗細(xì)。font-size/line-height規(guī)定字體尺寸和行高*smaller把font-size設(shè)置為比父元素更小的尺寸。*larger把font-size設(shè)置為比父元素更大的尺寸。*length把font-size設(shè)置為一個(gè)固定的值。*%把font-size設(shè)置為基于父元素的一個(gè)百分比值。*inherit規(guī)定應(yīng)該從父元素繼承字體尺寸。*xx-small到xx-large默認(rèn)值：mediumfont-family規(guī)定字體系列*caption定義被標(biāo)

13、題控件（比如按鈕、下拉列表等）使用的字體。*icon定義被圖標(biāo)標(biāo)記使用的字體。*menu定義被下拉列表使用的字體。*message-box定義被對(duì)話框使用的字體。*small-captioncaption字體的小型版本。*status-bar定義被窗口狀態(tài)欄使用的字體。五、CSS外邊距屬性（Margin）margin:margin-top;margin-right;margin-bottom;margin-left; HYPERLINK /css/pr_margin.asp margin在一個(gè)聲明中設(shè)置所有外邊距屬性。 HYPERLINK /css/pr_margin-bottom.asp m

14、argin-bottom設(shè)置元素的下外邊距。 HYPERLINK /css/pr_margin-left.asp margin-left設(shè)置元素的左外邊距。 HYPERLINK /css/pr_margin-right.asp margin-right設(shè)置元素的右外邊距。 HYPERLINK /css/pr_margin-top.asp margin-top設(shè)置元素的上外邊距。*auto瀏覽器計(jì)算外邊距。*length規(guī)定以具體單位計(jì)的外邊距值，比如像素、厘米等。默認(rèn)值是0px。*%規(guī)定基于父元素的寬度的百分比的外邊距。*inherit規(guī)定應(yīng)該從父元素繼承外邊距。六、CSS內(nèi)邊距屬性（Padd

15、ing）padding:padding-top;padding-right;padding-bottom;padding-left;七、CSS列表屬性（List）list-style:list_style-type;list_style_position;list-style-image;list-style-type設(shè)置列表項(xiàng)標(biāo)記的類型none無標(biāo)記。disc默認(rèn)。標(biāo)記是實(shí)心圓。circle標(biāo)記是空心圓。square標(biāo)記是實(shí)心方塊。decimal標(biāo)記是數(shù)字。decimal-leading-zero0開頭的數(shù)字標(biāo)記。(01,02,03,等。)lower-roman小寫羅馬數(shù)字(i,ii,iii

16、,iv,v,等。)upper-roman大寫羅馬數(shù)字(I,II,III,IV,V,等。)lower-alpha小寫英文字母Themarkerislower-alpha(a,b,c,d,e,等。)upper-alpha大寫英文字母Themarkerisupper-alpha(A,B,C,D,E,等。)lower-greek小寫希臘字母(alpha,beta,gamma,等。)lower-latin小寫拉丁字母(a,b,c,d,e,等。)upper-latin大寫拉丁字母(A,B,C,D,E,等。)hebrew傳統(tǒng)的希伯來編號(hào)方式armenian傳統(tǒng)的亞美尼亞編號(hào)方式georgian傳統(tǒng)的喬治亞編

17、號(hào)方式(an,ban,gan,等。)cjk-ideographic簡單的表意數(shù)字hiragana標(biāo)記是：a,i,u,e,o,ka,ki,等。（日文片假名）katakana標(biāo)記是：A,I,U,E,O,KA,KI,等。（日文片假名）hiragana-iroha標(biāo)記是：i,ro,ha,ni,ho,he,to,等。（日文片假名）katakana-iroha標(biāo)記是：I,RO,HA,NI,HO,HE,TO,等。（日文片假名）list-style-position設(shè)置在何處放置列表項(xiàng)標(biāo)記inside列表項(xiàng)目標(biāo)記放置在文本以內(nèi)，且環(huán)繞文本根據(jù)標(biāo)記對(duì)齊。outside默認(rèn)值。保持標(biāo)記位于文本的左側(cè)。列表項(xiàng)目標(biāo)記

18、放置在文本以外，且環(huán)繞文本不根據(jù)標(biāo)記對(duì)齊。inherit規(guī)定應(yīng)該從父元素繼承l(wèi)ist-style-position屬性的值。list-style-image使用圖像來替換列表項(xiàng)的標(biāo)記URL圖像的路徑。none默認(rèn)。無圖形被顯示。inherit規(guī)定應(yīng)該從父元素繼承l(wèi)ist-style-image屬性的值。八、內(nèi)容生成（GeneratedContent）content與:befor及:after偽元素配合使用，來插入生成內(nèi)容counter-increment屬性設(shè)置某個(gè)選取器每次出現(xiàn)的計(jì)數(shù)器增量counter-reset屬性設(shè)置某個(gè)選擇器出現(xiàn)次數(shù)的計(jì)數(shù)器的值quotes屬性設(shè)置嵌套引用（embed

19、dedquotation）的引號(hào)類型九、CSS尺寸屬性（Dimension）height屬性設(shè)置元素的高度*auto默認(rèn)。瀏覽器會(huì)計(jì)算出實(shí)際的高度。*length使用px、cm等單位定義高度。*%基于包含它的塊級(jí)對(duì)象的百分比高度。*inherit規(guī)定應(yīng)該從父元素繼承height屬性的值。 HYPERLINK /css/pr_dim_max-height.asp max-height設(shè)置元素的最大高度。2 HYPERLINK /css/pr_dim_max-width.asp max-width設(shè)置元素的最大寬度。2 HYPERLINK /css/pr_dim_min-height.asp mi

20、n-height設(shè)置元素的最小高度。2 HYPERLINK /css/pr_dim_min-width.asp min-width設(shè)置元素的最小寬度。2 HYPERLINK /css/pr_dim_width.asp width設(shè)置元素的寬度。十、CSS定位屬性（Positioning）bottom規(guī)定元素的底部邊緣。該屬性定義了定位元素下外邊距邊界與其包含塊下邊界之間的偏移imgbottom:5px值：auto;length;%/inheritleft規(guī)定元素的左邊緣。該屬性定義了定位元素左外邊距邊界與其包含塊左邊界之間的偏移。right/top左邊緣/上邊緣clear屬性規(guī)定元素的哪一側(cè)不

21、允許其他浮動(dòng)元素。clear:left/right/both(兩端)/inheritclip屬性剪裁絕對(duì)定位元素clip:rect(top,right,bottom,left);/auto/inherit*shape設(shè)置元素的形狀。唯一合法的形狀值是：rect(top,right,bottom,left)*auto默認(rèn)值。不應(yīng)用任何剪裁。*inherit規(guī)定應(yīng)該從父元素繼承clip屬性的值。cursor屬性規(guī)定要顯示的光標(biāo)的類型（形狀）url需使用的自定義光標(biāo)的URL。注釋：請(qǐng)?jiān)诖肆斜淼哪┒耸冀K定義一種普通的光標(biāo)，以防沒有由URL定義的可用光標(biāo)。default默認(rèn)光標(biāo)（通常是一個(gè)箭頭）auto

22、默認(rèn)。瀏覽器設(shè)置的光標(biāo)。crosshair光標(biāo)呈現(xiàn)為十字線。pointer光標(biāo)呈現(xiàn)為指示鏈接的指針（一只手）move此光標(biāo)指示某對(duì)象可被移動(dòng)。e-resize此光標(biāo)指示矩形框的邊緣可被向右（東）移動(dòng)。ne-resize此光標(biāo)指示矩形框的邊緣可被向上及向右移動(dòng)（北/東）。nw-resize此光標(biāo)指示矩形框的邊緣可被向上及向左移動(dòng)（北/西）。n-resize此光標(biāo)指示矩形框的邊緣可被向上（北）移動(dòng)。se-resize此光標(biāo)指示矩形框的邊緣可被向下及向右移動(dòng)（南/東）。sw-resize此光標(biāo)指示矩形框的邊緣可被向下及向左移動(dòng)（南/西）。s-resize此光標(biāo)指示矩形框的邊緣可被向下移動(dòng)（北/西）。

23、w-resize此光標(biāo)指示矩形框的邊緣可被向左移動(dòng)（西）。text此光標(biāo)指示文本。wait此光標(biāo)指示程序正忙（通常是一只表或沙漏）。help此光標(biāo)指示可用的幫助（通常是一個(gè)問號(hào)或一個(gè)氣球）。display屬性規(guī)定元素應(yīng)該生成的框的類型。none此元素不會(huì)被顯示。block此元素將顯示為塊級(jí)元素，此元素前后會(huì)帶有換行符。inline默認(rèn)。此元素會(huì)被顯示為內(nèi)聯(lián)元素，元素前后沒有換行符。inline-block行內(nèi)塊元素。（CSS2.1新增的值）list-item此元素會(huì)作為列表顯示。run-in此元素會(huì)根據(jù)上下文作為塊級(jí)元素或內(nèi)聯(lián)元素顯示。compactCSS中有值compact，不過由于缺乏廣泛

24、支持，已經(jīng)從CSS2.1中刪除。markerCSS中有值marker，不過由于缺乏廣泛支持，已經(jīng)從CSS2.1中刪除。table此元素會(huì)作為塊級(jí)表格來顯示（類似），表格前后帶有換行符。inline-table此元素會(huì)作為內(nèi)聯(lián)表格來顯示（類似），表格前后沒有換行符。table-row-group此元素會(huì)作為一個(gè)或多個(gè)行的分組來顯示（類似）。table-header-group此元素會(huì)作為一個(gè)或多個(gè)行的分組來顯示（類似）。table-footer-group此元素會(huì)作為一個(gè)或多個(gè)行的分組來顯示（類似）。table-row此元素會(huì)作為一個(gè)表格行顯示（類似）。table-column-group此元素

25、會(huì)作為一個(gè)或多個(gè)列的分組來顯示（類似）。table-column此元素會(huì)作為一個(gè)單元格列顯示（類似）table-cell此元素會(huì)作為一個(gè)表格單元格顯示（類似和）table-caption此元素會(huì)作為一個(gè)表格標(biāo)題顯示（類似）inherit規(guī)定應(yīng)該從父元素繼承display屬性的值。float屬性定義元素在哪個(gè)方向浮動(dòng)(float:left/right/none/inherit;)overflow屬性規(guī)定當(dāng)內(nèi)容溢出元素框時(shí)發(fā)生的事情。*visible默認(rèn)值。內(nèi)容不會(huì)被修剪，會(huì)呈現(xiàn)在元素框之外。hidden內(nèi)容會(huì)被修剪，并且其余內(nèi)容是不可見的。scroll內(nèi)容會(huì)被修剪，但是瀏覽器會(huì)顯示滾動(dòng)條以便查看

26、其余的內(nèi)容。auto如果內(nèi)容被修剪，則瀏覽器會(huì)顯示滾動(dòng)條以便查看其余的內(nèi)容。inherit規(guī)定應(yīng)該從父元素繼承overflow屬性的值。position屬性規(guī)定元素的定位類型*absolute生成絕對(duì)定位的元素，相對(duì)于static定位以外的第一個(gè)父元素進(jìn)行定位。元素的位置通過left,top,right以及bottom屬性進(jìn)行規(guī)定。h1position:absolute;left:15px;top:15px*relative生成相對(duì)定位的元素，相對(duì)于其正常位置進(jìn)行定位。因此，left:20會(huì)向元素的LEFT位置添加20像素。*fixed生成絕對(duì)定位的元素，相對(duì)于瀏覽器窗口進(jìn)行定位。元素的位置通

27、過left,top,right以及bottom屬性進(jìn)行規(guī)定。*inherit規(guī)定應(yīng)該從父元素繼承position屬性的值。vertical-align屬性設(shè)置元素的垂直對(duì)齊方式*baseline默認(rèn)。元素放置在父元素的基線上。sub垂直對(duì)齊文本的下標(biāo)。super垂直對(duì)齊文本的上標(biāo)top把元素的頂端與行中最高元素的頂端對(duì)齊text-top把元素的頂端與父元素字體的頂端對(duì)齊middle把此元素放置在父元素的中部。bottom把元素的頂端與行中最低的元素的頂端對(duì)齊。text-bottom把元素的底端與父元素字體的底端對(duì)齊。length%使用line-height屬性的百分比值來排列此元素。允許使用負(fù)

28、值。inherit規(guī)定應(yīng)該從父元素繼承vertical-align屬性的值。visibility屬性規(guī)定元素是否可見。*visible默認(rèn)值。元素是可見的。hidden元素是不可見的。collapse當(dāng)在表格元素中使用時(shí)，此值可刪除一行或一列，但是它不會(huì)影響表格的布局.被行或列占據(jù)的空間會(huì)留給其他內(nèi)容使用。如果此值被用在其他的元素上，會(huì)呈現(xiàn)為hiddeninherit規(guī)定應(yīng)該從父元素繼承visibility屬性的值。-index設(shè)置元素的堆疊順序。擁有更高堆疊順序的元素總是會(huì)處于堆疊順序較低的元素的前面。-index:auto/number/inherit十一、CSS表格屬性（Table）bo

29、rder-collapse設(shè)置表格的邊框是否被合并為一個(gè)單一的邊框，還是象在標(biāo)準(zhǔn)的HTML中那樣分開顯示*separate默認(rèn)值。邊框會(huì)被分開。不會(huì)忽略border-spacing和empty-cells屬性。*collapse如果可能，邊框會(huì)合并為一個(gè)單一的邊框。會(huì)忽略border-spacing和empty-cells屬性。*inherit規(guī)定應(yīng)該從父元素繼承border-collapse屬性的值。border-spacing屬性設(shè)置相鄰單元格的邊框間的距離（僅用于“邊框分離”模式）*lengthlength、inherit規(guī)定相鄰單元的邊框之間的距離。使用px、cm等單位。不允許使用負(fù)值。如果定義一個(gè)length參數(shù)，那么定義的是水平和垂直間距。如果定義兩個(gè)length參數(shù)，那么第一個(gè)設(shè)置水平間距，而第二個(gè)設(shè)置垂直間距。caption-side屬性設(shè)置表格標(biāo)題的位置。*top默認(rèn)值。把表格標(biāo)題定位在表格之上。*bottom把表格標(biāo)題定位在表格之下。*inhe