html表格用於布局教程的相關講解

表格在網頁布局方面起到了舉足輕重的作用，表格布局好像已經成為一個標准，隨便浏覽一些站點，它們大多是用表格布局的。相應的ｈｔｍｌ表格用於布局教程具體內容如下：

使用表格設計網頁布局，可以使網頁看上去更加整齊，適用於一般比較正規的網頁。網頁中的表格是由若干行和列組成，每一行(或者列)又由多個單元格組成，每個單元格中又可以反復地插入表格，以滿足網頁設計人員的布局需要。表格布局的優勢在於它能對不同對象加以處理，而又不用擔心不同對象之間的影響。如圖1所示，就是一幅完全使用表格進行布局的網頁。

圖1　使用表格布局的頁面

一、如何使用表格進行布局

下面我們通過一個具體的示例，來說明如何使用表格進行布局。假如我們要用表格布局出如圖2所示的頁面。

圖2　采樣表格布局的簡單頁面

(1)　根據需求創建表格

大家仔細考察圖2所示的頁面，能看出此圖中頁面表格一共有7行2列，第一行占2列，第二行左邊的單元格跨6行，其他單元格都是沒有跨多行跨多列的單元格。所以我們應該首先創建一個7行2列的表格，然後合並第一行2個單元格，設置第二行的第一個單元格跨6行，

(2)　設置表格屬性

根據圖片的大小以及文字的多少和大小來設計表格、行、單元格的高度、寬度、對齊方式。根據圖2.所示我們來給表格設置相關屬性，

根據需要，在對應單元格裡添加文字和圖片，添加完文字和圖片之後的頁面，所對應的完整代碼如示例1所示。

本章總結

◆　　創建表格至少需要3對標簽，即表格標簽…

、行標　簽…和單元格標簽…。

◆　　創建跨多列的表格是在單元格裡使用colspan屬性進行設置，創建跨多行的表格是在單元格裡使用rowspan屬性進行設置。

◆　表格的美化修飾主要從以下幾個方面進行：

●　　表格的高度(height)、寬度(width)和邊框(border)。

●　表格的背景(bgcolor和background)、行的背景色(bgcolor)、列的背景色(bgcolor)。

●　　表格、行、列的對齊方式(align)。

●　表格的填充(cellpadding)、間距(cellspacing)屬性。

◆　表格可在一定程度上控制文本和圖像在網頁中的位置，而不是完全由浏覽器對此進行控制。

以上就是精品學習提供的關於ｈｔｍｌ表格用於布局教程的內容，希望能夠帶給您幫助。