天天看點

CSS定義字型間距 字型行與行間距

CSS定義字型行間距 line-height:xxpx;

CSS定義字型間距

下面我們講述一下CSS的文本屬性,還是先來看一下文本屬性的詳細清單:

屬性     屬性含義     屬性值

Word-spacing     定義了各個單詞之間的間距     Normal<length>必須以長度為機關

Letter-spacing        定義了每個字母之間的間距     同上

Text-decoration     定義文字的“裝飾”樣式     None|underline|overline|

line-through|blink

Vertical-align     定義了元素在垂直方向

上的位置

    Baseline|sub|super|top|text-top|middle|bottom|text-bottom

<percentage>

text-transform     使文本轉換為其它形式     Capitalize|uppercase|lowercase|none

Text-align     定義了文字的對齊方式     Left|right|center|justify

Text-indent     定義了文本的首行的縮進方式     <length>|<percentage>

Line-height     定義了文本的行高     Normal|<unmber>|<length>|

我們可以從表中看到在這裡可以定義文本的文字間距、字母間距、裝飾、對齊方式、縮進方式和行高等屬性。

舉個例子來看看吧:

CODE:

<p style="letter-spacing:5px;text-align:justify;text-indent: 4em;line-height:17pt">我們看到經過文本屬性處理的文本字與字之間多了間距,行與行之間多了行高,對齊方式變成了兩端對齊,并且段首又多縮進了兩格。</p>

letter-spacing設定了字間距為5px,其中5px為一個長度機關;text-align設定了對齊方式為兩端對齊;indent設定了縮進格為4em;line-height設定了行高為17pt

從上面的例子,我們可以看出利用CSS的文本屬性可以友善的對頁面中的文本進行排版。