Dreamweaver 4 簡明教學(七、網頁的排版)

作者：Eve Cole 更新時間：2009-05-30 18:35:53

七、網頁的排版

表格的使用

表格是網頁的一個很重要元素，因為HTML本身並沒有提供更多的排版手段，我們往往就要藉助表格實作網頁的精細排版。可以說表格的是網頁製作中最重要的一個技巧，表格運用得好壞，直接反映了網頁設計師的水平。

點擊物件面板的

，看到如下的對話框：

① Rows：表格的行數；Columns：表格的列數；

② Width：表格的寬度，單位可以是Pixels（像數）或Percent（百分比）。以像素為單位定義的表格大小是固定的，而以百分比定義的表格，會依照瀏覽器的大小而改變。後面會繼續深入講解兩種定義方法的差別；

③ Border：表格線的寬度；

④ Cell Padding：單元格間距；Cell Spacing：單元格邊距。所謂的儲存格，就是表格裡面的每一小格。

按照如圖的設定後，就得到下面這個表格：

在表格線上點一下，可以全選整個表格，此時可在屬性面板上看到：

① Rows，Cols：表格的行和列；

② W，H：表格的寬和高，通常情況下，我們都不會定義表格的高度；

③ CellPad，CellSpace：單元格間距和單元格邊距；Border：表格線的寬度；

④ Ailgn：表格的對齊方式，可以將表格靠左（Left）、置中（Center）、靠右（Right）

⑤

：消除行的高度設定；

：消除列的寬度設定；

：將表格寬度的設定由百分比轉換為像素；

：將表格寬度的設定由像素轉換為百分比；

⑥ Bg Color：設定表格的背景顏色；

⑦ Brdr Color：設定表格線的顏色；

⑧ Bg Image：設定表格的背景圖，如果設定了背景圖，背景顏色就失效了；點選後面的公事包按鈕選擇背景圖；

如果我們把遊標移到其中一個單元格，此時看到的屬性面板又有所不同：

①

：合併儲存格（之前要先選擇對應的需要合併儲存格）；

：拆分單元格，拆分為多行或多列；

② Horz：單元格內部的水平對齊方式，作用與

類似；
Vert：單元格內部的縱向對齊方式；

③ W，H：單元格的寬度與高度；

④ Bg：單元格背景圖；

⑤ Bg：單元格背景顏色；

⑥ Brdr：單元格邊框顏色。