CSS系列：CSS文字樣式

1. 設置字體

　　在CSS中字體經過font-family屬性來設置。

font-family: Verdana, Arial, Helvetica, sans-serif;

　　上面的字體設置告訴瀏覽器首先在訪問者的計算機中尋找Verdana字體。若是該訪問者的計算機中沒有Verdana字體，則尋找Arial字體。若沒有Arial字體，再依次尋找Helvetica、sans-serif字體。若是這4種字體都沒有，則使用瀏覽器的默認字體顯示。

　　font-family屬性能夠同時聲明多種字體，字體之間用逗號分隔開。另一些字體的名稱中間會出現空格，如Times New Roman，這時須要用雙引號將其引發來，使瀏覽器知道這是一種字體的名稱。

2. 文字的大小

　　CSS經過font-size屬性來設置文字的大小。

font-size: 12px;

　　長度單位：

　　◊ px 表示在瀏覽器上1個像素的大小；

　　◊ em  1em表示在其父元素中字母m的標準寬度；

　　◊ ex   1ex表示字母x的標準高度。

3. 行高

　　CSS中經過line-height屬性設置。在CSS中line-height的值表示兩行文字之間基線的距離，即每行文字的高度。若是給文字加上下劃線，下劃線的位置就是文字的基線。

line-height: 30px;

　　除了能夠使用px等做爲行高的單位，也能夠不加任何單位，此時行高應該寫成與字體大小的比值。

line-height: 1.5;

　　CSS中字體、大小和行高的組合：

font: 12px/18px Verdana, Arial, Helvetica, sans-serif;

font: 12px/1.5 Verdana, Arial, Helvetica, sans-serif;

4. 文字顏色

color: blue;
color: #0000FF;
color: rgb(0,0,255);
color: rgb(0%,0%,100%);

5. 空白折行

white-space: nowrap;

6. CSS1定義的字體、顏色和文本屬性

屬性	類型	說明
font-family	字體	字體類型
font-style	字體	字體樣式，包括：normal、italic（斜體）、oblique（傾斜）
font-variant	字體	字體大小寫，包括：normal、small-caps（小型的大寫字母字體）
font-weight	字體	字體粗細
font-size	字體	字體大小
font	字體（複合屬性）	字體樣式，能夠包含全部字體屬性的聲明值
color	顏色	字體顏色
word-spacing	文本	詞間距
letter-spacing	文本	字符間距
text-decoration	文本	文本修飾線，包括：none（默認值）、blink（閃爍）、underline（下劃線）、line-through（中劃線）、overline（上劃線）
vertical-align	文本	文本垂直對齊方式，包括：auto、baseline、sub、supper、top、text-top、middle、bottom、text-bottom、length。
text-transform	文本	文本大小寫，包括：none（默認值）、capitalize（首字母大寫）、uppercase（大寫）、lowercase（小寫）
text-align	文本	文本的水平對齊方式，包括：left、right、center、justify（兩端對齊）
text-indent	文本	首行縮進
line-height	文本	行高

7. CSS2新增字體、顏色和文本屬性

屬性	類型	說明
font-size-adjust	字體	是否強制對文本使用同一尺寸
font-stretch	字體	是否橫向拉伸變形字體
text-shadow	文本	文本陰影效果
direction	文本	文本流入的方向，包括：ltr（默認值，從左到右）、rtl（從右到左）、inherit（由繼承得到）
unicode-bidi	文本	定義同一個頁面中存在不一樣方向讀進的文本顯示，與direction屬性一塊兒使用

8. CSS3新增字體、顏色和文本屬性

屬性	類型	說明
text-shadow	文本	文本陰影或模糊效果
text-overflow	文本	省略文本的處理方式
word-wrap	文本	文本超過指定容器的邊界時是否斷開換行

　　示例

text-shadow: -0.1em 0.1em #CCCCCC;

text-shadow: -0.1em 0.1em 0.3em #CCCCCC;

text-shadow: -0.1em 0.1em #CCCCCC,
        -0.1em 0.1em 0.3em #CCCCCC;

　　text-shadow屬性的第一個值表示水平偏移；第二個值表示垂直偏移，正值偏右或偏下，負值偏左或偏上；第三個值表示模糊半徑，可選；第四個值表示陰影是顏色，可選。

　　text-shadow屬性能夠接受一個以逗號分隔的陰影效果列表，並應用到元素的文本上。

text-overflow: ellipsis;

　　text-overflow屬性值包括：clip | ellipsis | ellipsis-word。

　　clip：不顯示省略標記，只是簡單的裁切。

　　ellipsis：當對象內文本溢出時顯示省略標記，省略標記插入的位置是最後一個字符。

　　ellipsis-word：當對象內文本溢出時顯示省略標記，省略標記插入的位置是最後一個詞。

word-wrap: break-word;

　　word-wrap屬性值包括：normal | break-word。

　　normal：連續文本換行。

　　break-word：內容將在邊界內換行。