❶ 網頁製作方面的高手進來看看 `...
1.1 什麼是HTML
1.1.1 Web頁的基本概念
1.1.1.1 Internet與WWW
通俗地講，Internet就是許多不同功能的計算機通過網路設備連接起來組成一個覆蓋全球的網路。從信息資源的角度看，Internet是一個集各個部門、各個領域的各種信息資源為一體，供網上用戶共享信息資源網。
Internet能提供的服務包括：WWW服務、E-mail服務、FTP服務、TELNET服務、網上傳呼（ICQ;OICQ）、電子商務、網路炒股、在線聊天、聯網游戲等。
由此可見，WWW(World Wide Web，譯為「萬維網」)並不就是Internet，它只是Internet提供的服務之一，不過它是Internet上發展最為蓬勃的部分，相當多的其他Internet服務是基於WWW服務的。
1.1.1.2 WWW與瀏覽器
從技術的角度講，WWW是由遍布在Internet上稱為Web伺服器的計算機組成，它將不同的信息資源有機地組織在一起，能過一種叫瀏覽器的軟體進行瀏覽。
瀏覽器是獲取WWW服務的基礎，它的基本功能就是對網頁進行顯示。
1.1.1.3 網站與主頁
WWW是由Internet上無數的Web伺服器構成的，通過瀏覽器訪問這些伺服器上的網頁，不同的網頁通過超鏈接聯系在一起，構成了WWW的縱橫交織結構。
通常我們把一系列邏輯上可以視為一個整體的頁面叫做網站，或者說，網站就是一個有共同主題的頁面的集合。
主頁是網站中一個特殊頁面，它是網站的入口頁面，其中包含指向其他頁面的超鏈接。通常主頁的名稱是固定的，例如：index.html（.html或.htm後綴表示HTML文檔）
1.1.2 HTML的工作原理
HTML（HyperText Markup Language，超文本標記語言）是表示網頁的一種規范（或者說是一種標准），它通過標記符定義了網頁內容如何顯示。
網頁是用HTML語言寫成的文本文件，但它與文本文件不同的是，網頁中包含有指向其它位置的鏈接，通過這些鏈接使網頁組織成了網狀結構。
在HTML文檔中，通過使用標記符可以告訴瀏覽器如何顯示見網頁，即確定網頁內容的顯示格式。所以HTML文檔就是網頁文件，有時也稱為Web頁。
1.2 創建Web頁
1.2.1 標記符基礎
HTML語言是影響網頁內容顯示格式的標記符集合，瀏覽器根據標記符決定網頁的實際顯示效果。
1.2.1.1 基本的HTML語法
在HTML中所有的標記都用尖括弧括起來。絕大多數的標記符是成對出現的，即有開始標記符與結束標記符，開始標記符和相應的結束標記符定義了標記所影響的范圍。結束標記符與開始標記符的區別是多一個斜線。例如：
<h1>讓我們一起來學習HTML!!</h1>
但是，也有少數標記符是單一的不成對的，例如：<br>、<hr>等。
HTML標記符是不區分大小寫的。
1.2.1.2 標記符的屬性
屬性是用來描述對象特徵的特性。許多標記符還包含一些屬性，以便對標記符作用的內容進行更詳細的控制。
在HTML中，所有的屬性都放置在開始標記符的尖括弧里，屬性與標記符之間用空格分隔；屬性的值放在相應的屬性名之後，用等號分隔；而不同的屬性之間用空格分隔。例如：
<font size=7 color=red>大家好</font>
1.2.2 Web頁的基本結構
HTML文檔中通常都包括以下基本標記符：<html>和</html>、<head>和</head>、<body>和</body>。
1.2.2.1 HTML標記
<html>是Web頁的第一個標記符，</html>是最後一個標記符。Web頁的其它所有內容都必須位於這兩個標記符之間。
1.2.2.2 首部標記
<head>和</head>位於Web頁的開頭，其中不包括Web頁的任何實際內容，而是提供一些與Web頁有關的特定信息。首標記的內容也用特定的標記括起來。
(1) TITLE 標記符
在首標記符中，最基本、最常用的是標題標記符<title></title>，用於定義網頁的標題，網頁標題可被瀏覽器用書簽和收藏清單。
(2) META 標記符
它用於說明Web頁有關的信息。在META標記符中常用的屬性有：name、http-quiv以及content。name是給出關於網頁某一屬性的名稱，而content是給出屬性的值，http-equiv指定HTTP響應名稱，通常用於替換name屬性。
META 標記符的一個常用功能是設置自動頁面跳轉。即使瀏覽器自動從一個頁面跳馬轉到另一個頁面。語法格式如下：
<META http-equiv="Refresh" content="5; url=URL">
(3) BGSOUND標記符
它用於指定網頁的背景音樂。語法格式如下：
<BGSOUND src=音樂文件 loop=播放次數>
音樂文件的格式一般為.wav、.mid或.mp3。
1.2.2.3 正文標記符
正文標記符<BODY>和</BODY>包含 Web 頁的內容。文字、圖形、鏈接以及其他 HTML 元素都位於該標記符內。
注意：空格、回車這些格式控制在顯示時都不起作用，如要使它們起作用，應使用預格式化元素<PRE>和</PRE>。
1.2.3 設置頁面屬性
正文標記符包括一些常用屬性，用於設置網頁背景顏色和圖案，以及設置文檔和超鏈接的顏色。
(1) 顏色的表示
在HTML中可以用兩種方式來表示顏色：
通過顏色名表示顏色
通過設置RGB（Red Green Blue）值來表示顏色
通過顏色名表示顏色，直接給出要顯示顏色的英文名稱即可。但是，在HTML中只保留了16個顏色名，所以用顏色名所能表示的顏色很有限。
通過RGB值表示顏色，是利用三色光的相互混合調制出成千上萬種顏色。
RGB表示法的標准格式是：以「#」開頭，後面緊跟著6位16進制數，每2位為一組，代表一種顏色成分，按「#RRGGBB」方式排列。
#000000 #008000
#C0C0C0 #00FF00
#808080 #808000
#FFFFFF #FFFF00
#800000 #000080
#FF0000 #0000FF
#800080 #008080
#FF00FF #00FFFF
1.2.3.2 設置頁面背景圖像
設置頁面背景圖像是通過設置BODY標記符中的background屬性實現的，其語法格式如下：
<body background="圖像文件的URL">
1.2.3.3 設置背景圖像水印效果
Internet Explorer還支持BODY標記符的另一個屬性—bgproperties，該屬性可以設置背景圖案的水印效果。語法格式如下：
<body background=圖像文件URL bgproperties=效果>
1.2.3.4 設置文字和超鏈接的顏色
設置正文和超鏈接的顏色，可以使用BODY標記符的text、link、vlink和alink屬性。常用的語法格式如下：
<body text=#RRGGBB link=#RRGGBB vlink=#RRGGBB alink=#RRGGBB>
其中：
text 用於設置正文顏色
link 用於設置未被訪問的超鏈接的顏色
vlink 用於設置已被訪問的超鏈接的顏色
alink 用於設置激活超鏈接的顏色
1.2.4 添加註釋
不論是編寫程序還是製作網頁，為所做的工作添加註釋都是一種良好的工作習慣。HTML 的注釋由開始標記符<!-- 和結束標記符 --> 構成。注釋內容都將被瀏覽器解釋為注釋，而不在瀏覽器中顯示。
1.2.5 顯示特殊字元
如果需要在網頁中顯示某些特殊字元，例如: <（小於號）、>（大於號）、」（引號）等，則需使用參考字元來表示，而不能直接輸入。參考字元以「&」號開始，以「；」結束，既可以使用數字代碼，也可以使用代碼名稱。 最常見的特殊字元如下表所示（完整的編碼請參見附錄2）
特殊字元 數字代碼 代碼名稱
" + "
& & &
< < <
> > >
1.3 發布Web頁
1.3.1 創建本地站點
1.3.2 申請網頁空間
1.3.3 用FTP上傳網頁
.1 文本分段
在HTML文檔中對段落的控制包括：段落標記符P、換行標記符BR、水平線標記符HR、標題標記符Hn、用於設置段落對齊的align屬性、DIV標記符以及CENTER標記符。
2.1.1 段落標記符P和換行標記符BR
分段標記符
分段標記符用於將文檔劃分為段落，標記為<P></P>，其中結束標記符通常可省略。
換行標記符
換行標記符用於在文檔中強制斷行，標記為一個單獨的<BR>。
2.1.2 水平線標記符HR
在HTML中除了可以用P標記劃分落，還可以用添加水平線的方法分隔文檔的不同部分。
水平線的標記符為<HR>，它包括以下屬性：
SIZE 屬性用來改變水平線的粗細程度
WIDTH 屬性用來更改水平線的長度
NOSHADE 屬性用來使水平線以實線顯示
COLOR 屬性用來設置水平線的顏色
ALIGN 屬性用來設置水平線的對齊方式
其中：COLOR 屬性在 Microsoft Internet Explorer 3 及更高版本中，通過在<HR>中設置 COLOR 屬性可以控制水平線的顏色。
2.1.3 標題標記符Hn
在HTML中，用戶可以通過Hn標記符來標識文檔中的標題和副標題，其中：n是1-6的數字；<H1>表示最大的標題，<H6>表示最小的標題。使用標題樣式時，必須使用結束標記符。
2.1.4 段落對齊
在HTML中，一般使用標記符的align屬性來設置段落的對齊方式。
2.1.4.1 align屬性
ALIGN 屬性用於設置段落的對齊格式，其值包括：
RIGHT（右對齊）
LEFT（左對齊）
CENTER（居中對齊）
JUSTIFY（兩端對齊）
ALIGN 屬性可應用於多種標記符，最典型的是應用於 DIV、P、Hn（標題標記符）、HR 等標記符。
2.1.4.2 DIV標記符CENTER標記符
DIV 標記符
DIV 標記符用於為文檔分節，以便為文檔的不同部分應用不同的段落格式，其標記為<DIV></DIV>。位於 DIV 標記符中的多段文本將被認為是一個節，可為它們設置一致的對齊格式。
SPAN 標記符
SPAN標記符的功能及用法與DIV相似，但通常用於標記一行內的某些字元。
CENTER 標記符
如果要將文檔內容居中，還可使用 CENTER 標記符，方法為：將需居中的內容置於<CENTER>和</CENTER>之間。
2.2 控制文本的顯示效果
2.2.1 字體控制標記符FONT
FONT標記符用於控制字元的樣式，包括開始標記符<FONT>和結束標記符</FONT>，FONT標記符具有3個常用的屬性：
size 屬性
字型大小屬性的值可以從 1 到 7，3 是默認值，字型大小越大顯示的字元就越大。該屬性值也可以用 +n 或 -n 來作為相對值指定。
color 屬性
字體標記符的 COLOR 屬性可用來控制文字的顏色，使用方法與正文標記符<BODY>中使用的 BGCOLOR 屬性相同。但要注意一般不能將color的屬性值與bgcolor的屬性值設置為相同。
face 屬性
FACE 屬性用來指定字體樣式。在這個屬性中用戶可以指定一個或幾個字體名稱（用逗號隔開）。
2.2.2 用物理字元樣式
所謂物理字元樣式，是指標記符本身就說明了所修飾文字的效果的標記符。常用的物理標記符有：
標記符 功能 標記符 功能
<B></B> 粗體 <STRIKE></STRIKE> 刪除線
<BIG></BIG> 大字體 <SUB></SUB> 上標
<I></I> 斜體 <SUP></SUP> 下標
<S></S> 刪除線 <TT></TT> 等寬
<SMALL></SMALL> 小字體 <U></U> 下劃線
2.2.3 邏輯字元樣式
所謂邏輯字元樣式是指標記符本身從某種程度上反映了被修飾對象所表示的含義。例如：ADDRESS標記符用以修飾某個地址。常用邏輯字元樣式如下表:
標記 功能
<ADDRESS></ADDRESS> 用於修飾地址
<CITE></CITE> 用於說明文本屬於引用
<CODE></CODE> 用於說明程序代碼
<DFN></DFN> 用於表示定義了術語
<EM></EM> 用於強調某些字詞
<KBD></KBD> 用於說明用戶的鍵盤輸入
<SAMP></SAMP> 用於表示文本樣本
<STRONG><STRONG> 用於強調某些字詞
<VAR></VAR> 用於表示變數
2.2.4 滾動文字效果
滾動文字是用於IE的一種常用網頁效果，它使位於<MARQUEE>和</MARQUEE>標記符之間的內容可以以滾動方式顯示。
在MARQUEE標記符中常用的屬性如下：
width和height 這兩個屬性定義了字元滾動區域的寬度和高度。可以用像素數和百分比來表示。
align 指定了滾動字元如何於周圍對象對齊。
behavior 定義了字元如何滾動。
bgcolor 定義了滾動字元區域的背景。
direction 定義了字元滾動的方向。
hspace和vspace 定義了滾動字元四周水平和垂直方向上的間隙。
loop 指定滾動重復次數
scrollamount 指定文本滾動步長的像素數。
scrolldelay 指定兩次滾動間的毫秒延時數。
2.3 列表格式
2.3.1 有序列表
有序列表（Ordered list）也稱數字式列表，它是一種在表的各項前顯示有數字或字母的縮排列表。
定義有序列表需要使用有序列表的方法格式如下：
<ol [type=x][start=n]>
<li [type=x][value=n]>列表項1
<li [type=x][value=n]>列表項2
. . .
</ol>
其中：type和start分別用來設置數字序列樣式和數字序列的起始值。n為任意整數；x的取值見下表：
值 含義
1 阿拉伯數字，默認值
A 大寫字母
a 小寫字母
I 大寫羅馬字母
i 小寫羅馬字母
2.3.2 無序列表
無序列表（Unordered list）也稱強調式列表，它是一種在表的各項前顯示有特殊項目符號的縮排列表。
<ul [type=x]>
<li [type=x]>列表項1
<li [type=x]>列表項2
. . .
</ul>
其中：type用來控制列表項前特殊符號的顯示。x的取值如下表：
值 含義
disc 實心圓
circle 空心圓
square 實心或空方塊，取決於瀏覽器
注意：在IE中，type的值是區分大小寫的。
2.3.3 定義列表
定義列表用於定義術語，它是一種在表的各項前沒有任何數字和符號的縮排列表。語法格式如下：
<DL>
<DT>術語1[</DT>]
<DD>說明1[</DD>]
<DT>術語2[</DT>]
<DD>說明2[</DD>]
. . .
</DL>
2.4 格式的嵌套中的問題
格式嵌套的問題，也就是要考慮當不同的格式設置作用於同一段內容時HTML將如何處理，通常的原則是：
如果嵌套的格式是相容的，則取格式疊加的效果
如果嵌套的格式是沖突的，則取離被修飾內容最近的樣式符的修飾效果 .1 Web頁圖像基礎
3.1.1 點陣圖與矢量圖
點陣圖圖形由排列成網格的稱為像素的點組成，如果把圖像放大到一點程度會看到像馬賽克那樣拼合在一起形成的圖像。
矢量圖形使用稱為矢量的線條和曲線描述圖像，它是用數學信息來描述圖像的。
3.1.2 Web頁圖像格式
雖然有很多計算機圖像格式，但由於受網路帶寬和瀏覽器的限制，在Web上常用的圖像格式有以下三種：GIF、JPEG和PNG，它們都是標準的點陣圖格式。
3.1.2.1 GIF格式
GIF格式（Graphic Interchange Format，圖形交換格式）採用圖像的無損壓縮處理，是目前在Web上應用最廣泛的圖像格式之一。GIF格式具有以下特點：
無損壓縮
最多 256 色
能夠使用透明色
交錯式 Gif（interlaced gif）
動畫 Gif
3.1.2.2 JPEG格式
JPEG格式（Joint PhotoGraphics Exper，聯合圖形專家組圖片格式）使用有損壓縮來減小圖片文件的大小，因此用戶將看到隨著文件的減小，圖片的質量也降低了。JPEG格式具有以下特點：
有損壓縮
沒有顏色限制
可以控制壓縮比
不支持透明色
不支持動畫
3.1.2.3 PNG格式
PNG格式（Portable Networks Graphics，可移植網路圖形格式）是近年來新出現的一種圖像格式，它適於任何類型，任何顏色深度的圖片。該格式採用無損壓縮來減小圖片文件的大小。PNG格式具有以下特點：
無損壓縮
沒有顏色限制
支持透明色，且透明度可調（0%-100%）
3.1.3 使用網頁圖像的要點
在網頁上使用圖片，通常應注意以下三點：
圖像文件的大小
網頁中圖片的數量和質量
合理的使用動畫
3.2 圖像處理的基本操作(略）
3.3 圖像標記符IMG
3.3.1 插入圖像
在HTML中，使用IMG標記符可以在網頁中插入圖像，它有兩個基本屬性：
src 表示要插入圖像文件的URL
alt 表示圖像的簡單文本說明
3.3.2 設置圖像屬性
3.3.2.1 指定圖像的寬和高
IMG標記符中的width和height屬性可以指定圖像的寬度和高度，其單位可以是像素，也可以是百分數，如果用百分數，表示圖像占當前瀏覽器窗口大小的比例。
3.3.2.2 圖像的邊框
使用IMG標記符的border屬性，可以給圖像添加邊框效果，邊框的取值是像素數。
3.3.2.3 設置圖像周圍的空白
在IMG標記符內使用屬性hspace和vspace設置圖像周圍的空白，其中hspace表示水平方向的空白，vspace表示垂直方向的空白，它們的取值都是像素。
3.3.2.4 圖像的對齊
(1) 圖像在頁面中的對齊
設置圖像在頁面中的對齊，可以使用DIV或P標記符將IMG標記符括起開，然後使用DIV或P標記符的align屬性。
(2) 圖像與周圍內容的垂直對齊
使用IMG標記符的align屬性，可以控制圖像與周圍內容的垂直對齊。此時，align屬性的值可以是：
top 表示圖像的頂部與周圍內容的頂部對齊
middle 表示圖像的中央與周圍內容對齊
bottom 表示圖像的底部與周圍內容的底部對齊，此值為默認值
(3) 圖文混排時的圖像對齊
如果要在圖像的左、右一環繞文本，也是使用IMG標記符的align屬性，此時的align的取值是：
left 表示圖像居左，文本在圖像的右側
right 表示圖像居右，文本在圖像的左側
3.4 創建超鏈接
3.4.1 相對地址與絕對地址
3.4.1.1 什麼是URL
URL（Universal Resource Locator，統一資源定位器）是表示Web上資源的一種方法，通常可以理解為資源的地址，一個URL，通常包括三部分：一個協議代碼、一個主機地址，以及資源在主機上的路徑和文件名。
3.4.1.2 絕對URL與相對URL
(1) 絕對URL
絕對URL是指Internet上資源的完整地址，其形式通常如下：
協議://主機名[/[路徑/]資源文件名]
例如：
http://www.aust.e.cn
ftp://ftp.aust.e.cn/pub/j2sdk.zip
(2) 相對URL
相對URL是指Internet上資源相對於當前頁面的地址，它包含從當前頁面指向目標頁面的路徑。
當使用相對URL時，可以使用與DOS文件目錄類似的特殊符號：點（.）和雙點（..），分別表示當前目錄和上一級目錄。
相對URL本身並不能唯一資源，但瀏覽器會根據當前頁面的絕對URL正確理解相對URL。
3.4.2 頁面鏈接
創建超鏈接使用A標記符，它的最基本屬性是href用於指定鏈接的目標。其語法格式如下：
<a href=目標對象URL>超鏈接</a>
其中：在<a>與</a>之間可以用任何可單擊的對象作為超鏈接的源，例如：文字或圖像。
如果href屬性指定的文件格式是瀏覽器所能識別的格式，那麼單擊超鏈接時將會直接顯示其內容，若瀏覽器不能識別，那麼那麼瀏覽器將下載所鏈接的對象。
3.4.3 錨點鏈接
當頁面較長時，就需要在頁面內部進行跳轉，要實現這一功能，首先就為頁面中需要跳轉到的位置設立標志並命名，即建立「錨點」。這通過A標記符的name屬性來實現，語法格式如下：
<a name=標志名>[...]</a>
對於錨點的鏈接，就將href的值指定為符號#後標志名（錨點名）。如果將href的值指定為一個單獨的#號，則表示空鏈接，不做任何跳轉。
3.4.4 電子郵件鏈接
當瀏覽網頁的用戶單擊了電子郵件的超鏈接後，系統將自動啟動郵件客戶程序，並將郵件地址填寫到「收件人」欄中，用戶可能編輯並發該郵件。電子郵件超鏈接的格式如下：
<a href="mailto:收件人郵箱">聯系</a>
3.5 使用圖像映射
3.5.1 什麼是圖像映射
所謂圖像映射是指在一幅圖中定義若干個區域，每個區域中指定一個不同的超鏈接，當單擊不同的區域時便可以跳轉到相應的目標頁面。
3.5.2 創建圖像映射
3.5.2.1 定義映射區域
定義映射區域使用MAP標記符，在<MAP>和</MAP>之間添加映射區域。添加映射區域使用AREA標記符。該標記符具有三個基本屬性：
href 標識出目標的URL
shape 說明映射區域的形狀。取值可是：
rect 矩形
circle 圓形
poly 多邊形
default 整個圖像區域
coords 用於標識映射區域的邊界。
3.5.2.1 對映射區域進行引用
標記了映射區域之後，就可以通過在IMG標記符中使用usermap屬性來引用相應的映射信息。
一個完整的圖像映射語法如下：
<map name="mymap">
<area href=URL1 shape=rect coords="x1,y1,x2,y2">
<area href=URL2 shape=circle coords="x,y,r">
<area href=URL3 shape=poly coords="x1,y1,x2,y2,...,xn,yn">
</map>
<img src=image_URL usemap=#mymap>
注意：map標記符中，name屬性的取值必須與img標記符中，usemap屬性的取值相同，只是usemap屬性的值前面多了一個# 。
4.1 創建表格
4.1.1 表格的基本構成
表格由行和列組成，行列交叉構成了單元格，對於某些表格來說，還有用於說明表格用途的標題。
在HTML中創建一個普通的表格應包括以下標記符：
TABLE 用於定義整個表格，表格內的所有內容都應位於<TABLE>和</TABLE>之間。
CAPTION 用於定義表格的標題，表格的標題應置於<CAPTION>和</CAPTION>之間，該標記的align屬性說明標題的位置，其取值如下：
top 標題置於表格上部中央（默認）
bottom 標題置於表格下部中央
left 標題置於表格上部的左側
right 標題置於表格上部右側
TR（table row）用於定義表格的行，對於每一個表格行，都對應一個TR標記符。
TD（table data） 表格中和每一個單元格都對應於一個TD標記符。
TH（table heading）用來定義表格行或列的標題所在的單元格。
4.1.2 合並單元格
如果在網頁中需要創建不規則的表格，可以通過合並單元格來實現。
行合並
在<TD>或<TH>標記符內使用rowspan屬性可以進行行合並，rowspan的取值表示垂直方向上合並的行數。
列合並
在<TD>或<TH>標記符內使用colspan屬性可以進行列合並，colspan的取值表示水平方向上合並的列數。
4.2 表格的屬性設置
4.2.1 邊框與分隔線
4.2.1.1 frame屬性
frame屬性用於控制是否顯示邊框，以及如何顯示邊框，該屬性的取值可以是：
void 表示無邊框（默認值）
above 表示僅有頂部邊框
below 表示僅有底部邊框
hsides 表示僅有頂部和底部邊框
vsides 表示僅有左、右邊框
lhs 表示僅有左邊框
rhs 表示僅有右邊框
box 表示包含全部四個邊框
border 表示包含全部四個邊框
4.2.1.2 rules屬性
rules屬性用於控制是否顯示以及如何顯示單元格之間的分隔線，取值可以是以下幾種：
none 表示無分隔線（默認值）
rows 表示僅有行分隔線
cols 表示僅有列分隔線
all 表示有所有分隔線
groups 表示僅在行級和列組有分隔線（目前所有的瀏覽器都尚不支持）
4.2.1.3 border屬性
border屬性用於設置邊框的寬度，其值為像素數。如果設置border=「0」，則意味著frame=「void」，rules=「none」（除非另外設置）；如果設置border為其它值（如何使用不指定值的單獨一個border，相當於border=「1」)，則意味著frame=「border」，rules=「all」（除非另外設置）。
4.2.2 控制單元格空白
在TABLE標記符中使用cellspacing屬性可以控制單元格之間的空白，使用cellpadding屬性可以控製表格分隔線和單元格中數據之間的距離，這兩個屬性的取值通常都採用像素數。
4.2.3 表格的對齊
表格的對齊包括表格在頁面中的對齊和表格數據在單元格中的對齊。
4.2.3.1 表格的頁面對齊
表格在頁面中的對齊，可以直接在TABLE標記符中使用align屬性進行設置。另外，也可以使用DIV標記的align屬性設置表格的對齊，方法是將TABLE標記符嵌套在<DIV align="...">和</DIV>之間。
如果不使用TABLE標記符的align屬性進行設置，則跟在表格後的文本自動顯示在表格的下一行，不會形成環繞的效果。如果使用TABLE的align屬性進行設置，並且使用的是lefg或right值，則跟在表格後面的文本會僅次於表格的右邊或左邊，從而形成文本與表格的環繞效果。
4.2.3.2 表格內容的水平對齊
設置表格內容的水平對齊方法是：在標記符<TR>、<TH>、<TD>內使用align屬性進行設置，常的取值可以是：
center 表示單元格內容居中對齊
left 表示單元格內容左對齊（默認值）
right 表示單元格內容右對齊
justify 表示內容兩端對齊(有些瀏覽器不支持，如：IE）
4.2.3.3 表格內容的垂直對齊
設置表格內容的垂直對齊方法是：在標記符<TR>、<TH>、<TD>內使用valign屬性進行設置，常的取值可以是：
top 表示數據靠單元格頂部
bottom 表示數據靠單元格底部
middle 表示數據在單元格垂直方向上居中（默認值）
4.3 使用表格設計網頁布局
本節介紹表格在網頁中另一個重要的應用——設計頁面布局，其技術主要包括：控製表格和單元格的大小、設置表格和單元格的背景、使用嵌套表格等。
4.3.1 控製表格和單元格的大小
由於表格能將網頁劃分為任意大小的矩形區域，所以表格在網頁中更多地是用作排版工具。通過標記符的width和height屬性設置表格和單元格大小，這兩個屬性的取值可以是像素數，也可以是百分比。
4.3.2 設置表格和單元格的背景
在TABLE、TR、TH或TD標記符內使用bgcolor屬性設置背景顏色，在TABLE、TH或TD標記符內使用bac
❷ 網頁HTML代碼中的h1，p，a，tr，td分別代表什麼意思，還有他們的全英文名是什麼
這些都是HTML中的常用標簽 他們都有特定的定義
沒有英文全名
HTML標簽詳解
結構
＜html＞
＜head＞
＜title＞標題＜/title＞
＜/head＞
＜body＞
..........文件內容..........
＜/body＞
＜/html＞
1.文件標題
＜title＞..........＜/title＞
2.文件更新--＜meta＞
【1】10秒後自動更新一次
＜meta http-equiv="refresh" content=10＞
【2】10秒後自動連結到另一文件
＜meta http-equiv="refresh" content="10；URL=欲連結文件之URL"＞
3.查詢用表單--＜isindex>
若欲設定查詢欄位前的提示文字：
＜isindex prompt="提示文字"＞
4.預設的基準路徑--＜base>
＜base href="放置文件的主機之URL"＞
版面
1.標題文字 ＜h#＞..........＜/h#＞ #=1~6；h1為最大字，h6為最小字
2.字體變化 ＜font＞..........＜/font＞
【1】字體大小 ＜font size=#＞..........＜/font＞ #=1~7；數字愈大字也愈大
【2】指定字型 ＜font face="字型名稱"＞..........＜/font＞
【3】文字顏色 ＜font color=#rrggbb＞..........＜/font＞ rr：表紅色（red）色碼 gg：表綠色（green）色碼 bb：表藍色（blue）色碼
3.顯示小字體 ＜small＞..........＜/small＞
4.顯示大字體 ＜big＞..........＜/big＞
5.粗體字 ＜b＞..........＜/b＞
6.斜體字 ＜i＞..........＜/i＞
7.打字機字體 ＜tt＞..........＜/tt＞
8.底線 ＜u＞..........＜/u＞
9.刪除線 ＜strike＞..........＜/strike＞
10.下標字 ＜sub＞..........＜/sub＞
11.上標字 ＜sup>..........＜/sup＞
12.文字閃爍效果 ＜blink＞..........＜/blink＞
13.換行 ＜br＞
14.分段 ＜p＞
15.文字的對齊方向 ＜p align="#"＞ #號可為 left：表向左對齊（預設值） center：表向中對齊 right：表向右對齊 P.S.＜p align="#"＞之後的文字都會以所設的對齊方式顯示， 直到出現另一個＜p align="#"＞改變其對齊方向，或遇到 ＜hr＞?＜h#＞標簽時會自動設回預設的向左對齊。
16.分隔線 ＜hr＞
【1】分隔線的粗細 ＜hr size=點數＞
【2】分隔線的寬度 ＜hr size=點數或百分比＞
【3】分隔線對齊方向 ＜hr align="#"＞ #號可為 left：表向左對齊（預設值） center：表向中對齊 right：表向右對齊
【4】分隔線的顏色 ＜hr color=#rrggbb＞
【5】實心分隔線 ＜hr noshade＞
17.向中對齊 ＜center＞..........＜/center＞
18.依原始樣式顯示 ＜pre＞..........＜/pre＞
19.＜body＞指令的屬性
【1】背景顏色 -- bgcolor ＜body bgcolor=#rrggbb＞
【2】背景圖案 -- background ＜body background="圖形文件名"＞
【3】設定背景圖案不會卷動 -- bgproperties ＜body bgproperties=fixed＞
【4】文件內容文字的顏色 -- text ＜body text=#rrggbb＞
【5】超連結文字顏色 -- link ＜body link=#rrggbb＞
【6】正被選取的超連結文字顏色 -- vlink ＜body vlink=#rrggbb＞
【7】已連結過的超連結文字顏色 -- alink ＜body alink=#rrggbb＞
20.註解 ＜!--..........--＞21.特殊字元表示法
符 號 語 法
＜ ＆lt
＞ ＆gt
& ＆amp
" ＆quot
空白 ＆nbsp
圖片
1.插入圖片 ＜img src="圖形文件名"＞
2.設定圖框 -- border ＜img src="圖形文件名" border=點數＞
3.設定圖形大小 -- width?height ＜img src="圖形文件名" width=寬度點數 height=高度點數＞
4.設定圖形上下左右留空 -- vspace?hspace ＜img src="圖形文件名" vspace=上下留空點數 hspace=左右留空點數＞
5.圖形附註 ＜img src="圖形文件名" alt="說明文字"＞
6.預載圖片
＜img src="高解析度圖形文件名" lowsrc="低解析度圖形文件名"＞ P.S.兩個圖的圖形大小最好一致
7.影像地圖（Image Map） ＜img src="圖形文件名" usemap="#圖的名稱"＞ ＜map name="圖的名稱"＞
＜area shape=形狀 coords=區域座標列表 href="連結點之URL"＞
＜area shape=形狀 coords=區域座標列表 href="連結點之URL"＞
＜area shape=形狀 coords=區域座標列表 href="連結點之URL"＞
＜area shape=形狀 coords=區域座標列表 href="連結點之URL"＞ ＜/map＞
【1】定義形狀 -- shape
shape=rect：矩形 shape=circle：圓形 shape=poly：多邊形
【2】定義區域 -- coords
a.矩形：必須使用四個數字，前兩個數字為左上角座標，後兩個數字為右下角座標
例：＜area shape=rect coords=100,50,200,75 href="URL"＞
b.圓形：必須使用三個數字，前兩個數字為圓心的座標，最後一個數字為半徑長度
例：＜area shape=circle coords=85,155,30 href="URL"＞
c.任意圖形（多邊形）：將圖形之每一轉折點座標依序填入
例：＜area shape=poly coords=232,70,285,70,300,90,250,90,200,78 href="URL"＞
表格
1.定義表格 ＜table＞..........＜/table＞
【1】設定邊框的厚度 -- border
＜table border=點數＞
【2】設定格線的寬度 -- cellspacing
＜table cellspacing=點數＞
【3】設定資料與格線的距離 -- cellpadding
＜table cellpadding=點數＞
【4】調整表格寬度 -- width
＜table width=點數或百分比＞
【5】調整表格高度 -- height
＜table height=點數或百分比＞
【6】設定表格背景色彩 -- bgcolor
＜table bgcolor=#rrggbb＞
【7】設定表格邊框色彩 -- bordercolor
＜table bordercolor=#rrggbb＞
2.顯示格線 ＜table border＞
3.表格標題
＜caption＞..........＜/caption＞
表格標題位置 -- align
＜caption align="#"＞ #號可為 top：表標題置於表格上方（預設值）
bottom：表標題置於表格下方
4.定義列 ＜tr＞
5.定義欄位 《1》＜td＞：靠左對齊
《2》＜th＞：靠中對齊?粗體
【1】水平位置 -- align ＜th align="#"＞
#號可為 left：向左對齊
center：向中對齊 right：向右對齊
【2】垂直位置 -- align ＜th align="#"＞ #號可為
top：向上對齊 middle：向中對齊
bottom：向下對齊
【3】欄位寬度 -- width
＜th width=點數或百分比＞
【4】欄位垂直合並 -- rowspan
＜th rowspan=欲合並欄位數＞
【5】欄位橫向合並 -- colspan
＜th colspan=欲合並欄位數＞
清單
一、目錄式清單
＜dir＞ ＜li＞項目1 ＜li＞項目2 ＜li＞項目3 ＜/dir＞ P.S.目錄式清單每一個項目不能超過20個字元（即10個中文字）
二、選項式清單 ＜menu＞ ＜li＞項目1 ＜li＞項目2 ＜li＞項目3 ＜/menu＞
三、有序號的清單 ＜ol＞ ＜li＞項目1 ＜li＞項目2 ＜li＞項目3 ＜/ol＞
【1】序號形式 -- type ＜ol type=#＞或＜li type=#＞ #號可為 A：表以大寫英文字母A?B?C?D...做為項目編號 a：表以小寫英文字母a?b?c?d...做為項目編號 I：表以大寫羅馬數字做為項目編號 i：表以小寫羅馬數字做為項目編號 1：表以阿拉伯數字做為項目編號（預設值）
【2】起始數字 -- start ＜ol start=欲開始計數的序數＞
【3】指定編號 -- value ＜li value=欲指定的序數＞
四、無序號的清單 ＜ul＞ ＜li＞項目1 ＜li＞項目2 ＜li＞項目3 ＜/ul＞
【1】項目符號形式 -- type ＜ul type=#＞或＜li type=#＞ #號可為 disc：實心圓點（預設值） circle：空心圓點 square：實心方塊
【2】原始清單 -- plain ＜ul plain＞
【3】清單排列方式 -- warp 《1》清單垂直排列 ＜ul warp = vert＞ 《2》清單水平排列 ＜ul warp = horiz＞
五、定義式清單 ＜dl＞ ＜dt＞項目1 ＜dd＞項目1說明 ＜dt＞項目2 ＜dd＞項目2說明 ＜dt＞項目3 ＜dd＞項目3說明 ＜/dl＞
緊密排列 -- compact ＜dl compact＞ P.S.如此可使＜dt＞的內容與＜dd＞的內容在同一行，僅 以數格空白相隔而不換行，但若＜dt＞的文字超過一 定的長度後，compact的作用就消失了！
表單
一、基本架構 ＜form action="處理資料用的CGI程式之URL"或"mailto:電子信箱的URL" method="get或post"＞ .......... .......... .......... ＜/form＞
二、輸入文件型表單 ＜form action="URL" method="post"＞ ＜input＞ ＜input＞ .......... .......... ＜/form＞
【1】欄位類型 -- type ＜input type=#＞ #號可為 text：文字輸入 password：密碼 checkbox：多選鈕 radio：單選鈕 submit：接受按鈕 reset：重設按鈕 image：圖形鈕 hidden：隱藏欄位
【2】欄位名稱 -- name ＜input name="資料欄名"＞ P.S.若type為submit?reset則name不必設定
【3】文件上的預設值 -- value ＜input value="預設之字串"＞
【4】設定欄位的寬度 -- size ＜input size=字元數＞
【5】限制最大輸入字串的長度 -- maxlength ＜input maxlength=字元數＞
【6】預設checkbox或radio的初值 -- checked ＜input type=checkbox checked＞ ＜input type=radio checked＞
【7】指定圖形的URL -- src ＜input type=image src="圖檔名"＞
【8】圖文對齊 -- align ＜input type=image align="#"＞ #號可為 top：文字對齊圖片之頂端 middle：文字對齊圖片之中間 buttom：文字對齊圖片之底部
三、選擇式表單 ＜form action="URL" method="post"＞ ＜select＞ ＜option＞ ＜option＞ .......... .......... ＜/select＞ ＜/form＞
A、＜select＞的屬性
【1】欄位名稱 -- name ＜select name="資料欄位名"＞
【2】設定顯示的選項數 -- size ＜select size=個數＞
【3】多重選項 -- multiple ＜select multiple＞
B、＜option＞的屬性
【1】定義選項的傳回值 -- value ＜option value="傳回值"＞
【2】預先選取的選項 -- selected ＜option selected＞
四、多列輸入文字區表單 ＜form action="URL" method="post"＞ ＜textarea＞ .......... .......... ＜/textarea＞ ＜/form＞
【1】文字區的變數名稱 -- name ＜textarea name=變數名稱＞
【2】設定文字輸入區寬度 -- cols ＜textarea cols=字元數＞
【3】設定文字輸入區高度 -- rows ＜textarea rows=列數＞
【4】輸入區設定預設字串 ＜textarea＞ 預設文字 ＜/textarea＞
【5】自動換行與否 -- wrap ＜textarea wrap=#＞ #號可為 off：表輸入的文字超過欄寬時，不會自動換行（預設值） virtual：表輸入的文字在超過欄寬時會自動換行
鏈接
一、連結至其他文件 ＜a href="URL"＞說明文字或圖片＜/a＞
二、連結至文件內之某一處（外部連結）
《1》起點
＜a href="檔名#名稱"＞..........＜/a＞
《2》終點 ＜a name="名稱"＞
三、frame的超連結
【1】開啟新的瀏覽器來顯示連結文件 -- _blank ＜a href="URL" target=_blank＞
【2】顯示連結文件於目前的frame -- _self ＜a href="URL" target=_self＞
【3】以上一層的分割視窗顯示連結文件 -- _parent ＜a href="URL" target=_parent＞
【4】以全視窗顯示連結文件 -- _top ＜a href="URL" target=_top＞
【5】以特定視窗顯示連結文件 --＜a href="URL" target="特定視窗名稱"＞
FRAME
一、分割視窗指令 ＜frameset＞..........＜/frameset＞
【1】垂直（上下）分割 -- rows
＜frameset rows=#＞ #號可為點數：如欲分割為100,200,300三個視窗，則
＜frameset rows=100,200,300＞；亦可以*號代表，如＜frameset rows=*,500,*＞
百分比：如＜frameset rows=30%,70%＞，各 項總和最好為100%
【2】水平（左右）分割 -- cols ＜frameset cols=點數或百分比＞
二?指定視窗內容 -- ＜frame＞
＜frameset cols=30%,70%＞ ＜frame＞ ＜frame＞ ＜/frameset＞
【1】指定視窗的文件名稱 -- src ＜frame src=HTML檔名＞
【2】定義視窗的名稱 -- name
＜frame name=視窗名稱＞
【3】設定文件與上下邊框的距離 -- marginheight
＜frame marginheight=點數＞
【4】設定文件與左右邊框的距離 -- marginwidth
＜frame marginwidth=點數＞
【5】設定分割視窗卷軸 -- scrolling
＜frame scrolling=#＞ #號可為 yes：固定出現卷軸
no：不出現卷軸 auto：自動判斷文件大小需不需要卷軸（預設值）
【6】鎖住分割視窗的大小 -- noresize ＜frame noresize＞
更多更全的請看下面http://www.w3school.com.cn/tags/