一、段落樣式
css中關於段落的樣式主要有行高，縮進，段落對齊，文字間距，文字溢出，段落換行等。它們的具體語法如下：
line-height : normal | length text-indent : length text-align : left | right | center | justify letter-spacing : normal | length text-overflow：clip | ellipsis word-wrap：normal | break-word
其中行高指的是段落中每一行文字所占據的高度，其與文字大小有着本質的區別。設置了行高之后，行內的文字會在行內垂直居中對齊（父容器不小於行高），這是網頁布局中常用的一種對齊方式。
例：
p { line-height:25px;font-size：15px}
用該種方式設置文本之后，文本標簽內的第一行內容會與文本的上邊框產生5像素的間距。
縮進是網文排版中經常用到的一中種樣式，它控制段落的首行縮進。
例：
p { text-indent:2em;}
p標簽中的文本首行縮進２個字符長度。其屬性值也可以是px，pt，cm等表示長度的單位。
段落對齊可以將標簽內的文字采用特有的方式對其，其屬性值分別表示的是向左對齊，向右對齊，居中對齊以及兩端對齊。其中居中對齊在網頁中布局中經常用到，而兩端對齊（justify ）則大多用於外文網站中對文章進行排版。
例：
p { text-align:center;}
p中的文本將處於中間部位。
letter-spacing和word-wrap分別表示文字間距和文本換行，不經常使用。letter-spacing所設的值通常指的是文字的水平間距，至於垂直間距，我們可以使用line-height來設置調整。word-wrap的兩個屬性值表示的是在邊界處是否斷行，normal不斷行，即可以溢出。而break-word則使內容將在邊界內換行。如果需要，單詞內部允許斷行。
text-overflow只是用來說明文字溢出時用什么方式顯示，要實現溢出時產生省略號的效果（ellipsis），還須定義強制文本在一行內顯示（white-space:nowrap）及溢出內容為隱藏（overflow:hidden），只有這樣才能實現溢出文本顯示省略號的效果。
例：
div,input{
overflow: hidden; /*條件1：超出部分隱藏*/
white-space: nowrap;/*條件2：強制在同一行內顯示所有文本*/
text-overflow: ellipsis;/*超出部分顯示。。。*/
}
二、背景
確定背景的樣式有顏色，圖片，平鋪方式，定位等。
１背景顏色
設置標簽的背景顏色通常使用到background-color : transparent | color
其中第一個值表示的是背景透明，第二個值則是一種顏色的表現方式。顏色的三種表現方式依次為英文字母，＃后接６位十六進制數，rgb()或rgba()。
例：
div{
background-color:red;
}
div{
background-color:#ff0000;/*這里可以簡寫為#f00*/
}
div{
background-color:rgb(255,0,0)
}
div{
background-color:rgba(255,0,0,1);/*第四個值為不透明度，取值范圍0~1*/
}
這四種表現方式都產生同樣的紅色背景。
２．背景圖片
background-image : none | url ( url )
使用背景圖片可以將文本外的圖片作為特定標簽的背景，其值為背景圖片相對於網頁文件的路徑或絕對路徑（網上的圖片）。
例：
body { background-image:url(images/bg.gif);}
同時背景圖片也可以是自定義的對象，css3中新增了線性漸變和徑向漸變，這里我們了解一下線性漸變。
例：
background-image:linear-gradient(to left, red 30%,blue);
上面的例子為元素設置了一個右邊0~30%的寬度為紅色，之后為從紅色到藍色的漸變。從子中可以看出線性漸變有三個值依次用逗號隔開，它們分別指的是漸變方向，起始點顏色和終點顏色。其中在顏色后可接空格加上百分比，表示該顏色在整個對象中所占的比例，隨后才開始發生漸變。
對於第一個屬性值，除了使用英文表示其漸變的方向外也可以用數字加deg（角度）來表示，其是以正上方為0deg，角度值按順時針方向依次增大。該值所描述的點為漸變的終點，其起點位置則處於該點按順時針旋轉的180deg方向元素的邊框上。
例：
background-image:linear-gradient(270deg, red 30%,blue);
它的顯現效果與上面的一致。
３．平鋪方式
background-repeat : repeat | no-repeat | repeat-x | repeat-y；
背景的平鋪方式一般用於背景是以圖片的方式呈現的情況下，其值分別表示的是鋪滿、不平鋪、沿Ｘ軸方向平鋪和沿Ｙ軸方向平鋪。
例：
body { background-repeat:repeat-x;}/*背景圖片或其他對象水平方向平鋪*/
４．背景定位
background-position : 左對齊方式 上對齊方式
背景定位表示的是所設置的背景對象相對於目標元素的位置，其兩個值分別表示水平方向和垂直方向上坐標，可以用英文表示，也可以用百分比，像素表示。
例：
body { background-position:left bottom;}
body { background-position:30% 20px;}
５．背景原點
background-origin ： border-box | padding-box | content-box;
該屬性設置元素背景圖片的原始起始位置，在設置該屬性時，必須保證背景的background-repeat為no-repeat，此屬性才會生效。所謂的原始起始位置其實也可以理解為背景的定位，只是它規定的三個屬性值使得這個定位只能規定在元素的邊框，內邊距，內容區上。如下圖所示：
6.背景顯示區
background-clip ： border-box | padding-box | content-box | text
設定了背景圖像向外裁剪的區域。即在元素內部所能看到的背景，其顯示結果如下：
7.背景尺寸
很多情況下，我們所設置的背景圖片並不與元素的尺寸所匹配，這時，我們要么只能看到背景圖片的一部分，要么會在元素內看到大量的空白背景，這與我們的預期不相符。未達到效果，我們便要對背景圖片的尺寸進行設置，其語法如下：
background-size：寬度值 高度值
對於其屬性值的取值，我們有以下五種取值方式：
auto 默認值，不改變背景圖片的原始高度和寬度。
長度值 成對出現如200px 50px，將背景圖片寬高依次設置為前面兩個值，當設置一個值時，將其作為圖片寬度值來等比縮放。
百分比 0％~100％之間的任何值，將背景圖片寬高依次設置為所在元素寬高乘以前面百分比得出的數值，當設置一個值時同上。
cover 可選。陰影的尺顧名思義為覆蓋，即將背景圖片等比縮放以填滿整個容器寸。
contain 可選。陰影的顏色。請參閱 CSS 顏容納，即將背景圖片等比縮放至某一邊緊貼容器邊緣為止色值。
通過對上面取值方式的了解，我們可以很方便將背景圖片設置成我們想要的樣子。
例：
div{
background:url(img_flwr.gif);
background-size:100% 100%;
background-repeat:no-repeat;
}
通過上面的設置，我們便將背景圖片的尺寸設置成了完全填充元素的樣式。
了解了以上七種背景樣式的設置之后，我們可以在實際代碼操作中進行簡寫，其格式如下：
background: 背景色 背景圖片 背景平鋪方式 背景定位
使用這種方式我們可以大大減少代碼量的書寫。
例：
body {
background-color:# EDEDED;
background-image:url(images/bg.png);
background-repeat:no-repeat;
background-position:50% 30px;}
進行縮寫后則只有一行代碼
body { background:#EDEDED url(images/bg.png) no-repeat 50% 30px;}
以上是對某元素設置單一背景，了解上面的知識后，我們也可以對一個元素設置多個背景圖片。具體語法如下：
background ： [background-color] | [background-image] | [background-position][/background-size] | [background-repeat] | [background-attachment] | [background-clip] | [background-origin],...
我們只需要用逗號隔開每組 background 的縮寫值，其中要注意的是：
1.如果有 size 值，需要緊跟 position 並且用 "/" 隔開；
2.如果有多個背景圖片，而其他屬性只有一個（例如 background-repeat 只有一個），表明所有背景圖片應用該屬性值。
3.background-color 只能設置一個。