3.3 行距

行與行之間的距離最常用的稱呼是行距，而當(dāng)網(wǎng)頁(yè)設(shè)計(jì)者們發(fā)現(xiàn)他們能夠控制行距時(shí)最常用的稱呼是"Weee!"

行高

行高簡(jiǎn)直是上帝發(fā)給人間的福音。利用行高我們可以隨心所欲地控制行與行之間的垂直距離。

B { line-height: 16pt }

你所用的參數(shù)就是相鄰兩行的基準(zhǔn)線（基準(zhǔn)線就是英文小寫(xiě)字母如x,a的下階線，但不包括諸如y,g等字母超過(guò)下階線的部分）之間的垂直距離。注意你所設(shè)定的參數(shù)將完全代替瀏覽器的缺省參數(shù)。

Netscape Communitor和Internet Explorer在行之前加入行高參數(shù)。所以如果你將參數(shù)設(shè)為10px，瀏覽器將把文字的第1行以10px的高度顯示。

有3種設(shè)定行高的方法：

• 數(shù)字

• 長(zhǎng)度單位

• 比例

用數(shù)字設(shè)行距

B { font-size: 12pt; 
line-height: 2 }

當(dāng)你用數(shù)字設(shè)定行高的時(shí)候，瀏覽器將利用字號(hào)來(lái)確定行距：它將字號(hào)乘以設(shè)定的參數(shù)值。所以，在本例中，行高將是24點(diǎn)。顯示效果如下：

Four score and seven years ago,
the Web wasn't yet a glimmer in
anyone's eye. No one needed it,
no one missed it. Eighty-seven
years from now, what will
people laugh at us for lacking?

你還可以用小數(shù)設(shè)定參數(shù)值。

（你應(yīng)該知道IE 3 不支持?jǐn)?shù)字參數(shù)值，在IE 3 中使用數(shù)字參數(shù)將出現(xiàn)大片文字的互相重疊。）

用長(zhǎng)度單位設(shè)定行距

B { font-size: 12pt; line-height: 11pt }

設(shè)定行高的另一種方法就是利用先前學(xué)過(guò)的長(zhǎng)度單位（em及pt是最常用的單位），以下為顯示效果：

Four score and seven years ago,
the Web wasn't yet a glimmer in
anyone's eye. No one needed
it, no one missed it.
Eighty-seven years from now,
what will people laugh at us
for lacking?

你既可以輕松地將行距縮小也可以將行距放大。有了樣式表，這一切都易如反掌！

用比例設(shè)定行距

B { font-size: 10pt; line-height: 140% }

在本例中，行距是長(zhǎng)度10points的140％，即14points。明白了嗎？

讓文字互相重疊!

你可能會(huì)問(wèn)這樣的問(wèn)題：如果行距太小的話，文字豈不就重疊在一起了嗎？是這樣的。我們來(lái)看看這個(gè)例子：

B { font-size: 28pt; line-height: 2pt }

以下為顯示效果:

Whoa.
Cool.

"Whoa" 使用了瀏覽器的缺省行高設(shè)置。但"Cool"的行高很小所以它和第1行重疊了。 

（Communicator和Internet Explorer對(duì)行高的詮釋有所不同。 Communicator將只是將文字的上半部分重疊一點(diǎn)，而IE則將其全部重疊。）

如果你計(jì)劃將你的網(wǎng)頁(yè)中的某些內(nèi)容重疊顯示，行高設(shè)置還不是最佳的選擇，因?yàn)椴煌臑g覽器對(duì)其的支持有差別。在第5天的課程中我們將研究文字及圖象布局的最佳方式。