文本樣式text
1.文本顏色color
例如h1 {color:red;}
2.文本方向direction,不常用
默認ltr從左到右,rtl表示從右到左
3.文本水平對齊方式text-align
如果文本方向為ltr即從左到右則默認左對齊,如果文本方向為rtl即從右到左則默認右對齊
left、center、right、justify分別表示左對齊、居中、右對齊、兩端對齊
4.文本垂直對齊方式vertical-align,一般表格中會用到
默認為baseline,放在父元素的基線上
sub、supper垂直對齊文本的下標、上標,top、middle、bottom把元素的頂端與行中最高、中間、最低元素的頂端對齊,text-top、text-bottom把元素的頂端與父元素字體的頂端、低端對齊
5.設置或刪除文本的裝飾text-decoration
默認為none標准文本,這對於鏈接來說會去掉下面的下划線
underline、overline、line-through、blink分別表示文本下的一條線、文本上的一條線、穿過文本的一條線、閃爍的文本
6.文本首行縮進text-indent
默認0不縮進,text-indent:50px表示縮進50px
7.單詞間距word-spacing,僅對英文單詞有效,不常用
默認為normal,word-spacing:30px表示單詞之間的間距為30px
8.字符間距letter-spacing,不常用
默認為normal,letter-spacing:2px表示字符間距為2px,字符間距可取負值
9.行高line-height
默認為normal,可通過具體值或者n%表示
10.文本轉換text-transform
uppercase、lowercase、capitalize分別表示將英文字母轉換為大寫、小寫、單詞首字母大寫
11.元素內空白的處理方式white-space
默認為normal被瀏覽器忽略,
nowrap:不換行,在上一行繼續進行,直到遇到<br>換行標簽
pre:被瀏覽器保留,類似html中的<pre>標簽
pre-nowrap:保留空白符序列,但是正常地進行換行
pre-line:合並空白符序列,但是保留換行符
12.文本陰影text-shadow
默認為none
如果有陰影則需指明水平和垂直方向,即h-shadow v-shadow
語法text-shadow:h-shadow v-shadow blur color
字體樣式font
1.字體系列font-family,不常用
如果字體系列的名稱超過一個字,則必須用引號;應該設置幾個字體名稱作為一種"后備"機制,如果瀏覽器不支持第一種字體將嘗試下一種
font-family:"Times New Roman", Times, serif;
2.字體樣式font-style
默認為normal正常字體,italic表示斜體,oblique和italic非常類似
3.字體大小font-size
字體大小用像素px表示,在ie中常用em來表示字體大小
默認字體大小為16px,即1em
默認為normal正常,lighter、bold、bolder分別表示細、粗、更粗的字體
也可直接用數值100-900表示,font-weight:400等同於normal,700等同於bold
5.小型大寫字母font-variant
默認為normal正常,small-caps會顯示小型大寫字母的字體
例如對“My name is Hege Refsnes.”設置small-caps后,顯示效果如下
上述所有設置字體的屬性可集合在一起,直接通過font屬性表示,按需選擇即可。