1、CSS 背景屬性（Background）

屬性描述CSS

background	在一個(gè)聲明中設(shè)置所有的背景屬性。	1
background-attachment	設(shè)置背景圖像是否固定或者隨著頁面的其余部分滾動(dòng)。	1
background-color	設(shè)置元素的背景顏色。	1
background-image	設(shè)置元素的背景圖像。	1
background-position	設(shè)置背景圖像的開始位置。	1
background-repeat	設(shè)置是否及如何重復(fù)背景圖像。	1

設(shè)定順序?yàn)?#xff1a;

[background-color] | [background-image] | [background-repeat] | [background-attachment] | [background-position]

?

eg:

?? background-color: #FFCC66;
?? background-image: url("butterfly.gif");
?? background-repeat: no-repeat;
?? background-attachment: fixed;???//固定在屏幕上，scroll:表示背景圖隨著頁面移動(dòng)，即固定在頁面上。
?? background-position: right bottom;

2、顏色的幾種定義和輸入方式

值描述

color_name	規(guī)定顏色值為顏色名稱的背景顏色（比如 red）。
hex_number	規(guī)定顏色值為十六進(jìn)制值的背景顏色（比如 #ff0000）。
rgb_number	規(guī)定顏色值為 rgb 代碼的背景顏色（比如 rgb(255,0,0)）。
transparent	默認(rèn)。背景顏色為透明。
inherit	規(guī)定應(yīng)該從父元素繼承 background-color 屬性的設(shè)置。

?

?

CSS 邊框?qū)傩?#xff08;Border 和 Outline）

屬性描述CSS

border	在一個(gè)聲明中設(shè)置所有的邊框?qū)傩浴?/td>	1
border-bottom	在一個(gè)聲明中設(shè)置所有的下邊框?qū)傩浴?/td>	1
border-bottom-color	設(shè)置下邊框的顏色。	2
border-bottom-style	設(shè)置下邊框的樣式。	2
border-bottom-width	設(shè)置下邊框的寬度。	1
border-color	設(shè)置四條邊框的顏色。	1
border-left	在一個(gè)聲明中設(shè)置所有的左邊框?qū)傩浴?/td>	1
border-left-color	設(shè)置左邊框的顏色。	2
border-left-style	設(shè)置左邊框的樣式。	2
border-left-width	設(shè)置左邊框的寬度。	1
border-right	在一個(gè)聲明中設(shè)置所有的右邊框?qū)傩浴?/td>	1
border-right-color	設(shè)置右邊框的顏色。	2
border-right-style	設(shè)置右邊框的樣式。	2
border-right-width	設(shè)置右邊框的寬度。	1
border-style	設(shè)置四條邊框的樣式。	1
border-top	在一個(gè)聲明中設(shè)置所有的上邊框?qū)傩浴?/td>	1
border-top-color	設(shè)置上邊框的顏色。	2
border-top-style	設(shè)置上邊框的樣式。	2
border-top-width	設(shè)置上邊框的寬度。	1
border-width	設(shè)置四條邊框的寬度。	1
outline	在一個(gè)聲明中設(shè)置所有的輪廓屬性。	2
outline-color	設(shè)置輪廓的顏色。	2
outline-style	設(shè)置輪廓的樣式。	2
outline-width	設(shè)置輪廓的寬度。	2

1、圖示：

code eg:

body {
????? margin-top:100px;
????? margin-right:40px;
????? margin-bottom:10px;
????? margin-left:70px;
}
2、border-style

?

?

?

CSS 文本屬性（Text）

屬性描述CSS

color	設(shè)置文本的顏色。	1
direction	規(guī)定文本的方向 / 書寫方向。	2
letter-spacing	設(shè)置字符間距。	1
line-height	設(shè)置行高。	1
text-align	規(guī)定文本的水平對(duì)齊方式。	1
text-decoration	規(guī)定添加到文本的裝飾效果。	1
text-indent	規(guī)定文本塊首行的縮進(jìn)。	1
text-shadow	規(guī)定添加到文本的陰影效果。	2
text-transform	控制文本的大小寫。	1
unicode-bidi	設(shè)置文本方向。	2
white-space	規(guī)定如何處理元素中的空白。	1
word-spacing	設(shè)置單詞間距。	1

CSS 字體屬性（Font）

屬性描述CSS

font	在一個(gè)聲明中設(shè)置所有字體屬性。	1
font-family	規(guī)定文本的字體系列。	1
font-size	規(guī)定文本的字體尺寸。	1
font-size-adjust	為元素規(guī)定 aspect 值。	2
font-stretch	收縮或拉伸當(dāng)前的字體系列。	2
font-style	規(guī)定文本的字體樣式。	1
font-variant	規(guī)定文本的字體樣式。	1
font-weight	規(guī)定字體的粗細(xì)。	1

說明： 1、字體族名稱（family-name）

字體族名稱（通常所說的“字體”），包括“Arial”、“Times New Roman”、“宋體”、“黑體”等等。

族類（generic family）

一個(gè)族類是一組具有統(tǒng)一外觀的字體族。sans-serif就是一例，它代表一組沒有“腳”的字體。

如：

2、font-style定義所選字體的顯示樣式：normal（正常）、italic（斜體）或oblique（傾斜）。

3、font-variant（字體變化）的值可以是：normal（正常）或small-caps（小體大寫字母），small-caps字體是一種以小尺寸顯示的大寫字母來代替小寫字母的字體。

4、font-weight指定字體顯示的濃淡程度。其值可以是normal（正常）或bold（加粗）。

5、font-size字體大小，后面兩種可以隨著瀏覽器改變字體大小。?
?? h1 {font-size: 30px;}
? h2 {font-size: 12pt;}
? h3 {font-size: 120%;}
? p {font-size: 1em;}

font屬性的值應(yīng)按以下次序書寫：

font-style | font-variant | font-weight | font-size | font-family

?

CSS 外邊距屬性（Margin）

屬性描述CSS

margin	在一個(gè)聲明中設(shè)置所有外邊距屬性。	1
margin-bottom	設(shè)置元素的下外邊距。	1
margin-left	設(shè)置元素的左外邊距。	1
margin-right	設(shè)置元素的右外邊距。	1
margin-top	設(shè)置元素的上外邊距。	1

CSS 內(nèi)邊距屬性（Padding）

屬性描述CSS

padding	在一個(gè)聲明中設(shè)置所有內(nèi)邊距屬性。	1
padding-bottom	設(shè)置元素的下內(nèi)邊距。	1
padding-left	設(shè)置元素的左內(nèi)邊距。	1
padding-right	設(shè)置元素的右內(nèi)邊距。	1
padding-top	設(shè)置元素的上內(nèi)邊距。	1

CSS 列表屬性（List）

屬性描述CSS

list-style	在一個(gè)聲明中設(shè)置所有的列表屬性。	1
list-style-image	將圖象設(shè)置為列表項(xiàng)標(biāo)記。	1
list-style-position	設(shè)置列表項(xiàng)標(biāo)記的放置位置。	1
list-style-type	設(shè)置列表項(xiàng)標(biāo)記的類型。	1
marker-offset	?	2

內(nèi)容生成（Generated Content）

屬性描述CSS

content	與 :before 以及 :after 偽元素配合使用，來插入生成內(nèi)容。	2
counter-increment	遞增或遞減一個(gè)或多個(gè)計(jì)數(shù)器。	2
counter-reset	創(chuàng)建或重置一個(gè)或多個(gè)計(jì)數(shù)器。	2
quotes	設(shè)置嵌套引用的引號(hào)類型。	2

CSS 尺寸屬性（Dimension）

屬性描述CSS

height	設(shè)置元素高度。	1
max-height	設(shè)置元素的最大高度。	2
max-width	設(shè)置元素的最大寬度。	2
min-height	設(shè)置元素的最小高度。	2
min-width	設(shè)置元素的最小寬度。	2
width	設(shè)置元素的寬度。	1

CSS 定位屬性（Positioning）

屬性描述CSS

bottom	設(shè)置定位元素下外邊距邊界與其包含塊下邊界之間的偏移。	2
clear	規(guī)定元素的哪一側(cè)不允許其他浮動(dòng)元素。	1
clip	剪裁絕對(duì)定位元素。	2
cursor	規(guī)定要顯示的光標(biāo)的類型（形狀）。	2
display	規(guī)定元素應(yīng)該生成的框的類型。	1
float	規(guī)定框是否應(yīng)該浮動(dòng)。	1
left	設(shè)置定位元素左外邊距邊界與其包含塊左邊界之間的偏移。	2
overflow	規(guī)定當(dāng)內(nèi)容溢出元素框時(shí)發(fā)生的事情。	2
position	規(guī)定元素的定位類型。	2
right	設(shè)置定位元素右外邊距邊界與其包含塊右邊界之間的偏移。	2
top	設(shè)置定位元素的上外邊距邊界與其包含塊上邊界之間的偏移。	2
vertical-align	設(shè)置元素的垂直對(duì)齊方式。	1
visibility	規(guī)定元素是否可見。	2
z-index	設(shè)置元素的堆疊順序。	2

CSS 打印屬性（Print）

屬性描述CSS

orphans	設(shè)置當(dāng)元素內(nèi)部發(fā)生分頁時(shí)必須在頁面底部保留的最少行數(shù)。	2
page-break-after	設(shè)置元素后的分頁行為。	2
page-break-before	設(shè)置元素前的分頁行為。	2
page-break-inside	設(shè)置元素內(nèi)部的分頁行為。	2
widows	設(shè)置當(dāng)元素內(nèi)部發(fā)生分頁時(shí)必須在頁面頂部保留的最少行數(shù)。	2

CSS 表格屬性（Table）

屬性描述CSS

border-collapse	規(guī)定是否合并表格邊框。	2
border-spacing	規(guī)定相鄰單元格邊框之間的距離。	2
caption-side	規(guī)定表格標(biāo)題的位置。	2
empty-cells	規(guī)定是否顯示表格中的空單元格上的邊框和背景。	2
table-layout	設(shè)置用于表格的布局算法。	2

?

?

?

?

?

轉(zhuǎn)載于:https://www.cnblogs.com/lovemo1314/archive/2012/08/03/2622179.html

總結(jié)

以上是生活随笔為你收集整理的CSS各属性表的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。