3.2 字間距及字母間距

字間距

利用字間距屬性，你可以在字之間加入更的距離：

H3 { word-spacing: 1em }

你所使用的參數(shù)值將加入任何瀏覽器的缺設(shè)置，你可以使用我們昨天談到的任何種長度單位：

• in （英寸）
• cm （厘米）
• mm （毫米）
• pt （點數(shù)）
• pc （打字機字間距）
• em （ems）
• ex (x-height)
• px （象素）

字母間距

字母間距可以在IE 4中應(yīng)用，但Communicator不行，唉...

H3 { letter-spacing: 10px }

字母間距的功能和字間距的很類似：其參值將被加入到瀏覽器的缺省設(shè)置中，你以使用上述任何一種長度單位。

如果你用的是IE 4，這里是一個例子：

Behold the power of cheese.

對于這兩種屬性，你都可以使用normal參數(shù)。從而使其按照瀏覽器的原有缺省設(shè)置顯示。

3.3 行距

行高

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

B { line-height: 16pt }注意LINE是行的意思

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

• 數(shù)字
• 長度單位
• 比例

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

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

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

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

用比例設(shè)定行距

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

讓文字互相重疊!

你可能會問這樣的問題：如果行距太小的話，文字豈不就重疊在一起了嗎？是這樣的。我們來看看這個例子：

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

讓文字互相重疊!

你可能會問這樣的問題：如果行距太小的話，文字豈不就重疊在一起了嗎？是這樣的。我們來看看這個例子：

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

以下為顯示效果:

Whoa.
Cool.

3.4 文字對齊及縮行

文字對齊

利用文字對齊屬性，你可以控制段落的水平對齊：

H4 { text-align: center }

垂直對齊

H4 { vertical-align: top }

垂直對齊可以使你控制文字或替代要素（比如圖象）相對于其母體要素的的垂直位置。例如，如果你將一個2x2象素的GIF圖象同其母體要素文字的頂部垂直對齊，則該GIF圖象將在該行文字的頂部顯示。

以下為各項參數(shù)：

• top將要素頂部同最高的母體要素對齊。
• bottom將要素的底部同最低的母體要素對齊。 
• text-top將要素的頂部同母體要素文字的頂部對齊。
• text-bottom將要素的底部同母體要素文字的底部對齊。
• baseline將要素的基準線同母體要素的基準線對齊。
• middle將要素的中點同母體要素的中點對齊。
• sub將要素以下標的形式顯示。
• super將要素以 上標的形式顯示。

文字縮行

你想使段落縮行嗎？（在Internet上呆一段時間之后，你可能已經(jīng)忘了縮行是怎么一回事！）

P { text-indent: 2em }

3.5 邊距及空格填充

快速定義邊距

每一個整塊的素或替代要素都包含在樣式表生成器稱為box的容器之內(nèi)。box包括：

• 要素本身
• 圍繞要素的空格填充（padding）

圍繞空格填充的邊框（border）邊框顏色P { border-color: #666699 #FF邊框樣式

你還可以設(shè)定邊框線的樣式，例：

P { border-style: double; border-width: 3px }

0033 #000000 #FFFF99; border-width: 3px }

• solid
• double
• dotted
• dashed
• groove
• ridge
• inset
• outset
•  
• 圍繞邊框的邊距（空白－margin）

3.7 浮動要素

浮動（就是定位）

浮動屬性使你能將一個要素周圍用文字包裹，不僅僅是包裹圖象，而且能包裹整塊的文字。

H4 { float: left }

清除

如果你想使一段文字包裹某一要素，而下一段文字不包裹，你可以使用clear屬性，很象HTML的CLEAR屬性的用法（例： CLEAR=right）。

P { clear: left }

今天學(xué)習(xí)的可以比喻成兩個模子，兩個模塊需要設(shè)置間距，進一步可以比喻成多個模子，多個模子需要設(shè)置行距，需要排版，需要對邊框border,margin,padding進行設(shè)置

• css