傳統的網頁結構及佈局方法

此處介紹的是傳統的網頁結構組成部分，以及基本的佈局方法。

網頁組成部分

（01）從上而下，傳統的經典網頁可以分為基本的頁頭、主體、頁尾三個部分，各個部分又可以細分。

（02）網頁的頁頭稱為header。標誌logo、登陸條loginbar、頁面橫幅廣告banner、菜單欄nav（navigation bar）等內容都可以放在頁頭。

（03）網頁的主體是網頁的內容部分，稱為content。一般的，可以把content分為兩到三個豎列，包括側欄sidebar、欄目column等。

（04）網頁的頁尾稱為footer，用來放置版權申明、使用協議等，也可放一些導航鏈接。

網頁佈局：使用表格或層（div）佈局網頁

（01）傳統的網頁佈局方法主要有表格佈局和層（div）佈局方法。兩者都是按照網頁結構框架把網頁的內容組織安排起來。

（02）使用表格佈局需要知道表格的標籤和屬性等知識。表格由<table>標籤來定義。每個表格均有若干行（由<tr>標籤定義），每行被分割為若干單元格（由<td>標籤定義）。<table>標籤的主要屬性包括height、width、cellpadding（規定單元邊沿與其內容之間的空白，單元格邊距）、cellspacing（規定單元格之間的空白，單元格間距）、border（規定表格邊框的寬度）、align（規定表格相對周圍元素的對齊方式）。<table>標籤的屬性可以參考W3C的HTML參考手冊中HTML <table> 標籤部分內容。<td>標籤的主要屬性包括height、width、align（規定單元格內容的水平對齊方式）、valign（規定單元格內容的垂直排列方式）、background等。<td>標籤的屬性可以參考W3C的HTML參考手冊中HTML <td>標籤部分內容。

（03）使用層（DIV）佈局網頁需要掌握基本的DIV知識，DIV又與CSS密不可分，通常又稱為DIV+CSS佈局。熟練掌握Div和CSS的佈局方法需要對盒子模型有足夠的瞭解。一個盒子由4個獨立部分組成：最外邊的是邊界（margin）；第二部分是邊框（border），邊框可以有不同的樣式；第三部分是填充（padding），填充用來定義內容區域與邊框（border）之間的空白；第四部分是內容區域。使用DIV+CSS佈局的基本理念是：將頁面用Div分塊；設計各塊的位置。使用CSS來定義樣式。一般使用<div  id="id選擇符">的方式。注：熟悉CSS、DIV命名規則，例如樣式文件命名主要的:佈局版面:專欄:文字:打印樣式:主題: