本篇文章給大家談?wù)剋eb制作網(wǎng)站的代碼，以及編寫網(wǎng)頁的代碼對(duì)應(yīng)的知識(shí)點(diǎn)，希望對(duì)各位有所幫助，不要忘了收藏本站喔。

本文目錄一覽：

• 1、急求！?。【W(wǎng)頁設(shè)計(jì) HTML代碼大全
• 2、怎樣用Dreamweaver套用網(wǎng)站源代碼制作網(wǎng)頁
• 3、怎么用代碼制作一個(gè)網(wǎng)站
• 4、制作網(wǎng)頁的所有代碼和代碼意思

急求！??！網(wǎng)頁設(shè)計(jì) HTML代碼大全

HTML標(biāo)記_HTML大全_HTML標(biāo)記大全_超文本標(biāo)記語言

網(wǎng)頁（WebPage）文件主要是用超文本標(biāo)記語言（HyperText Markup Language，簡稱HTML）語句來寫成。您可以通過IE瀏覽器的“查看”菜單中的“源文件”看到該頁的HTML代碼。HTML語言由一系列元素(element)組成，用于組織文件的內(nèi)容和指導(dǎo)文件的輸出格式。元素名稱不分大小寫。一個(gè)元素可以有多個(gè)屬性，屬性及其屬性值不分大小寫。屬性名＝屬性值合起來構(gòu)成一個(gè)完整的屬性，一個(gè)元素可以有多個(gè)屬性，各個(gè)屬性用空格分開。元素又由標(biāo)記(tag)的構(gòu)成，大多數(shù)標(biāo)記是成對(duì)出現(xiàn)的，分起始標(biāo)記 (start tag)和結(jié)尾標(biāo)記/ (end tag)，以便和頁面的內(nèi)容區(qū)分開來。其寫成的文件是標(biāo)準(zhǔn)的ASCII文件，不同于一般的編程語言，故稱為腳本（Script）更準(zhǔn)確一點(diǎn)。其實(shí)也很簡單，特別是在專門的HTML編輯器的幫助下，您可以迅速地學(xué)會(huì)HTML，并能很快寫出有自己特色的Homepage來。

需要說明的是：各種瀏覽器對(duì)html元素及其屬性的解釋不完全一樣，如NC與IE是有區(qū)別的。

標(biāo) 簽 內(nèi) 容 備 注

基 本 標(biāo) 簽 所有HTML文件都有的

html……/html 表示文件類型為HTML文檔

head……/head 設(shè)置文檔描述及其他不在WEB網(wǎng)頁上顯示的信息

body……/body HTML文檔的主體（頁面的實(shí)際內(nèi)容）

標(biāo) 題 標(biāo) 簽 　

title……/title 在標(biāo)題欄中顯示的題目（放在head/head內(nèi)）

擴(kuò) 展 屬 性 標(biāo) 簽 　

base

基址標(biāo)簽，為解決相對(duì)編址作參考值

META

將HTTP命令發(fā)給CONTENT=number;url允許，描述不包含在標(biāo)準(zhǔn)HTML里的文檔信息。使用詳解

link

提供將現(xiàn)行文檔與其它文檔或?qū)嶓w關(guān)聯(lián)起來的信息

ISINDEX 指明在服務(wù)器上提供文檔的可以檢索的索引

style……/style 允許包含樣式表（CSS）信息

頁 面 屬 性 標(biāo) 簽 body……/body標(biāo)簽的擴(kuò)展屬性。使用詳解

body bgcolor=#…… 設(shè)置背景顏色，用名字或十六進(jìn)制值

body text=#…… 設(shè)置文本文字顏色，用名字或十六進(jìn)制值

body link=#…… 設(shè)置鏈接顏色，用名字或十六進(jìn)制值

body vlink=#…… 設(shè)置已使用的鏈接的顏色，用名字或十六進(jìn)制值

body alink=#…… 設(shè)置正在被擊中鏈接的顏色，用名字或十六進(jìn)制值

文 本 標(biāo) 簽 　

pre……/pre 創(chuàng)建預(yù)格式化文本

h1……/h1 創(chuàng)建最大的標(biāo)題

h6……/h6 創(chuàng)建最小的標(biāo)題

b……/b 創(chuàng)建黑體字

i……/i 創(chuàng)建斜體字

tt……/tt 創(chuàng)建打字機(jī)風(fēng)格的字體

cite……/cite 創(chuàng)建一個(gè)引用，通常是斜體

em……/em 加重（通常是斜體加黑體）

strong……/strong 強(qiáng)調(diào)（通常是斜體加黑體）

font size=value/font 設(shè)置字體大小，從1到7

font color=……/font 設(shè)置字體的顏色，使用名字或十六進(jìn)制值

鏈 接 　

a href="/URL"/a 創(chuàng)建一個(gè)超鏈接

a href="mailto:EMAIL" /a 創(chuàng)建一個(gè)自動(dòng)發(fā)送電子郵件的鏈接

a name="NAME"/a 創(chuàng)建一個(gè)位于文檔內(nèi)部的靶位

a href="#NAME"/a 創(chuàng)建一個(gè)指向位于文檔內(nèi)部靶位的鏈接

格 式 排 版 　

p 創(chuàng)建一個(gè)新的段落

p align=…… 將段落按左、中、右對(duì)齊

br 插入一個(gè)回車換行符

blockquote……/blockquote 從兩邊縮進(jìn)文本

dl……/dl 創(chuàng)建一個(gè)定義列表

dt 放在每個(gè)定義術(shù)語詞之前

dd 放在每個(gè)定義之前

ol……/ol 創(chuàng)建一個(gè)標(biāo)有數(shù)字的列表

li 放在每個(gè)數(shù)字列表項(xiàng)之前，并加上一個(gè)數(shù)字

ul……/ul 創(chuàng)建一個(gè)標(biāo)有圓點(diǎn)的列表

li 放在每個(gè)圓點(diǎn)列表項(xiàng)之前，并加上一個(gè)圓點(diǎn)

div align=…… 一個(gè)用來排版大塊HTML段落的標(biāo)簽，也用于格式化表

圖 形 元 素 　

img src="/name" 添加一個(gè)圖像

img src="/name" align=value 排列對(duì)齊一個(gè)圖像：左中右或上中下

img src="/name" border=value 設(shè)置圍繞一個(gè)圖像的邊框的大小

hr 加入一條水平線

hr size=value 設(shè)置水平線的大小（高度）

hr width=value 設(shè)置水平線的寬度（百分比或絕對(duì)像素點(diǎn)）

hr noshade 創(chuàng)建一個(gè)沒有陰影的水平線

表 格 　

table……/table 創(chuàng)建一個(gè)表格

tr……/tr 開始表格中的每一行

td……/td 開始一行中的每一個(gè)格子

th……/th 設(shè)置表格頭：一個(gè)通常使用黑體居中文字的格子

表 格 屬 性 　

table border=value 設(shè)置圍繞表格的邊框的寬度

table cellspacing=value 設(shè)置表格格子之間空間的大小

table cellpadding=value 設(shè)置表格格子邊框與其內(nèi)部內(nèi)容之間空間的大小

table width=value 或 % 設(shè)置表格的寬度－用絕對(duì)像素值或文檔總寬度的百分比

tr align=…… 設(shè)置表格格子的水平對(duì)齊（左中右）

tr valign=…… 設(shè)置表格格子的垂直對(duì)齊（上中下）

td colspan=value 設(shè)置一個(gè)表格格子應(yīng)跨占的列數(shù)（缺省為1）

td rowspan=value 設(shè)置一個(gè)表格格子應(yīng)跨占的行數(shù)（缺省為1）

td nowrap 禁止表格格子內(nèi)的內(nèi)容自動(dòng)斷行回卷

窗 框 　

frameset……/frameset 放在一個(gè)窗框文檔的body標(biāo)簽之前，也可以嵌在其他窗框文檔中

frameset rows="value,value" 定義一個(gè)窗框內(nèi)的行數(shù)，可以使用絕對(duì)像素值或高度的百分比

frameset cols="value,value" 定義一個(gè)窗框內(nèi)的列數(shù)，可以使用絕對(duì)像素值或?qū)挾鹊陌俜直?/p>

frame 定義一個(gè)窗框內(nèi)的單一窗或窗區(qū)域

noframes……/noframes 定義在不支持窗框的瀏覽器中顯示什么提示

窗 框 屬 性 　

frame src="/URL" 規(guī)定窗框內(nèi)顯示什么HTML文檔

frame name="name" 命名窗框或區(qū)域以便別的窗框可以指向它

frame marginwidth=value 定義窗框左右邊緣的空白大小，必須大于等于1

frame marginheight=value 定義窗框上下邊緣的空白大小，必須大于等于1

frame scrolling=value 設(shè)置窗框是否有滾動(dòng)欄，其值可以是"yes","no","auto"，缺省時(shí)一般為"auto"

frame noresize 禁止用戶調(diào)整一個(gè)窗框的大小

表 單 對(duì)于功能性的表單，一般需要運(yùn)行一個(gè)CGI小程序，HTML僅僅是產(chǎn)生表單的表面樣子。

form……/form 創(chuàng)建所有表單

select multiple name="NAME" size=value………/select 創(chuàng)建一個(gè)滾動(dòng)菜單，size設(shè)置在需要滾動(dòng)前可以看到的表單項(xiàng)數(shù)目

option 設(shè)置每個(gè)表單項(xiàng)的內(nèi)容

select name="NAME"……/select 創(chuàng)建一個(gè)下拉菜單

textarea name="NAME" cols=value rows=value……/textarea 創(chuàng)建一個(gè)文本框區(qū)域，列的數(shù)目設(shè)置寬度，行的數(shù)目設(shè)置高度

input type="checkbox" name="NAME" 創(chuàng)建一個(gè)復(fù)選框，文字在標(biāo)簽后面

input type="radio" name="NAME" value="x" 創(chuàng)建一個(gè)單選框，文字在標(biāo)簽后面

input type=text name="……" size=value 創(chuàng)建一個(gè)單行文本輸入?yún)^(qū)域，size設(shè)置以字符計(jì)的寬度

input type="submit" value="NAME" 創(chuàng)建一個(gè)submit（提交）按鈕

input type="image" border=0 name="NAME" src="/name.gif" 創(chuàng)建一個(gè)使用圖象的submit（提交）按鈕

input type="reset" 創(chuàng)建一個(gè)reset（重置）按鈕

附 加 屬 性 　

PRE……/PRE 預(yù)置格式風(fēng)格標(biāo)簽用來顯示字體寬度固定的文本塊，主要用來在表格格式中顯示文本

TT……/TT 打字機(jī)風(fēng)格用來顯示打字機(jī)字體寬度固定的文本

SAMP……/SAMP 示例風(fēng)格以單倍距顯示文本

ADDRESS……/ADDRESS 地址風(fēng)格一般用于文檔的開始或結(jié)尾處，并以斜體格式顯示文本。

DL……/DL 定義列表風(fēng)格用來顯示術(shù)語及其定義

顏色

#=rrggbb 16 進(jìn)制 RGB 數(shù)值，或者是下列預(yù)定義色彩：

Black,Olive,Teal,Red,Blue,Maroon,Navy, Gray,Lime,Yellow,white,Silver,Fuchsia,Purple,Green,Aqua[返回本頁首部]

META標(biāo)簽

描述不包含在標(biāo)準(zhǔn)HTML里的文檔信息。

META NAME="keywords" CONTENT="yourkeyword"

META NAME="description" CONTENT="your homepage's description"

本頁的關(guān)鍵字和描述。在頁面里加上這些定義后，一些搜索引擎就能夠讓讀者根據(jù)這些關(guān)鍵字搜索到您的主頁，了解你的主頁內(nèi)容。

META HTTP-EQUIV="refresh" CONTENT="30, URL=new.htm"

瀏覽器將在30秒后，自動(dòng)轉(zhuǎn)到new.htm。您可用它制作一個(gè)封面，在若干時(shí)間后，自動(dòng)帶讀者來到您的目錄頁。如果URL項(xiàng)沒有，瀏覽器就是刷新本頁。這就是WWW聊天室定期刷新的實(shí)現(xiàn)原理。

meta http-equiv="Content-Type" content="text/html; charset=gb2312"

描述本頁使用的語言。瀏覽器根據(jù)此項(xiàng)，就可以選擇正確的語言編碼，而不需要讀者自己在瀏覽器里選擇。GB2312是指簡體中文，而臺(tái)灣BIG5內(nèi)碼的主頁則是用BIG5。

META HTTP-EQUIV="Pragma" CONTENT="no-cache"

強(qiáng)制性調(diào)用網(wǎng)上的最新版本。瀏覽器為節(jié)約時(shí)間，在本地硬盤上保存一個(gè)臨時(shí)文件。在重新調(diào)用時(shí)，便直接顯示那個(gè)臨時(shí)文件。如果您想讓讀者每次都看到最新的版本，可加上句。[返回本頁首部]

LINK

顯示本文檔和其他文檔之間的連接關(guān)系。一個(gè)最有用的應(yīng)用就是外部層疊樣式表的定位。格式如下：

LINK REL="stylesheet" href="/style.css"REL參數(shù)說明兩個(gè)文檔之間的關(guān)系，HREF說明目標(biāo)文檔名。關(guān)于層疊樣式表，將在后面的課程中詳述。[返回本頁首部]

BASE

本文檔的原始地址。語法：BASE HREF="原始地址"當(dāng)讀者下載您的文檔后，由此可以知道是從哪里下載的。[返回本頁首部]

BODY

BODY標(biāo)記有一些屬性，用于定義頁面內(nèi)的顯示效果。 ALINK、LINK、TEXT、VLINK—— 文字的顏色。

ALINK：當(dāng)前激活的連接的文字顏色。

LINK：連接的文字顏色。

TEXT：文字的顏色。

VLINK：參觀過的文字顏色。

注意：文字的顏色要和背景色有明顯的差別，以便讀者瀏覽。

BACKGROUND、BGPROPERTIES、BGCOLOR——頁面的背景部分。

BACKGROUND：背景圖案，該圖案在頁面內(nèi)平鋪。背景圖案應(yīng)保持單一色調(diào)，以保證頁面文字易于閱讀。

BGPROPERTIES：設(shè)置成FIXED，則背景圖案不滾動(dòng)。（只對(duì)INTERNET EXPLORER有效）

BGCOLOR：背景色。

注意：如果你的背景圖案是深色調(diào)，因之文字顏色為淡顏色，那么由于瀏覽器調(diào)用頁面的順序是“背景色-文字-背景圖案”，那么在背景圖案沒有顯示的情況下，你的文字在白顏色下很難閱讀，所以應(yīng)該選用一個(gè)跟你的背景圖案顏色一致的背景色。

LEFTMARGIN、TOPMARGIN——頁邊空白。（只對(duì)INTERNET EXPLORER有效）

LEFTMARGIN：左邊頁邊空白。

TOPMARGIN：頂端頁邊空白。

怎樣用Dreamweaver套用網(wǎng)站源代碼制作網(wǎng)頁

用Dreamweaver套用網(wǎng)站源代碼制作網(wǎng)頁方法：

一、定義站點(diǎn)

1、 在任意一個(gè)根目錄下創(chuàng)建好一個(gè)文件夾（我們這里假設(shè)為E盤），如取名為MyWeb。

備注：網(wǎng)站中所用的文件都要用英文名。

2、打開Dreamweaver，選擇“站點(diǎn)—新建站點(diǎn)”，打開對(duì)話框。在站點(diǎn)名稱中輸入網(wǎng)站的名稱（可用中文），在本地根文件夾中選擇剛才創(chuàng)建的文件夾（E:web）。然后確定即可。

備注：再次打開Dreamweaver，會(huì)自動(dòng)找到剛才設(shè)立的站點(diǎn)。如果有多個(gè)站點(diǎn)，可以在菜單“站點(diǎn)—打開站點(diǎn)”中去選擇。

二、創(chuàng)建頁面

1、在本地文件夾E:\MyWeb下面的空白處，按右鍵選“新建文件”，這樣就建好了一個(gè)頁面，默認(rèn)的文件名為untitled.htm。htm就表示這個(gè)網(wǎng)頁文件是一個(gè)靜態(tài)的HTML文件。給它改名為index.htm。

網(wǎng)站第一頁的名字通常是index.htm或index.html。其它頁面的名字可以自己取。

2、雙擊index.htm進(jìn)入該頁面的編輯狀態(tài)。在標(biāo)題空格里輸入網(wǎng)頁名稱，按右鍵選頁面屬性，打開“頁面屬性”窗口。在這里可以設(shè)置網(wǎng)站的標(biāo)題、背景顏色或背影圖像，超級(jí)鏈接的顏色（一般默認(rèn)即可），其他都保持默認(rèn)即可。

3．此時(shí)光標(biāo)位于左上角，可輸入一句話，如“歡迎來到我的主頁”。選取文字，用菜單“窗口/屬性”打開屬性面板，選取文字大小為6，再使文字居中，然后在文字前用幾個(gè)回車使其位于頁面中間。

4．如要選取字體，則選擇字體中的最后一項(xiàng)：編輯字體列表。然后在對(duì)話框中選+號(hào)，接著在“可用字體”欄中選擇需要加入到字體列表中的一種字體，點(diǎn)擊中間的按鈕就可以加入了。

在網(wǎng)頁上最常用的是宋體字。不要將特殊的字體加到列表中使用，因?yàn)閯e人電腦上未裝就看不到。如果需要用的話，要做成圖片后再使用。

在網(wǎng)頁上打入空格的辦法是：把輸入法調(diào)為全角。

在網(wǎng)頁上換行的辦法是：shift+Enter。只按Enter則為換段。

三、為頁面添加圖片

1、在本地文件夾E:\MyWeb下面的空白處，按右鍵選“新建文件夾”，這樣建立了一個(gè)文件夾，用它來放圖片，可以改名為tu或pic或images都可以。

2、用菜單“窗口/對(duì)象”打開對(duì)象面板，點(diǎn)擊“插入圖像”，在對(duì)話框里選要插入的圖片。如果會(huì)出現(xiàn)對(duì)話框：“你愿意將該文件復(fù)制到根文件夾中嗎？”，必須選“是”，然后將它保存到剛建好的文件夾里。

3、選中該圖片，打開屬性面板，可以在上面為圖片取名，重新設(shè)置圖片的高、寬，拖住圖片角上的點(diǎn)可以變大小。按住shift鍵，再拖動(dòng)角上的點(diǎn)，可以使圖片保持寬高比例拉伸。如要恢復(fù)這原始大小，則單擊右下角的“重設(shè)大小”按鈕。

4、“鏈接”可以直接在這里輸入地址?！疤娲笔菆D片的說明，即鼠標(biāo)指向圖片所顯示的文字；“邊框”是圖片邊框?qū)挾龋皩?duì)齊”是對(duì)齊方式。

四、添加超級(jí)鏈接

1、為文字添加鏈接。

比如，在頁面上輸入“我的文章”，然后將其選中，打開屬性面板，在“鏈接”一格中，選擇它所要鏈接到的頁面即可。后面一格“目標(biāo)”我們一般常用的是self即打開的新窗口代替了現(xiàn)開的窗口；或是選擇blank即打開新窗口。

2、為圖片添加鏈接

與上面文字的鏈接同理，插入圖片，然后在屬性面板中的鏈接一格中選擇即可。

圖片可以創(chuàng)建不同的多個(gè)鏈接。方法如下：

在屬性面板中的“地圖”一項(xiàng)下面有一些圖形，比如點(diǎn)擊方形，光標(biāo)變成十字，在圖片上畫一個(gè)藍(lán)色矩形的熱區(qū)，此時(shí)在屬性面板上可以為這個(gè)熱區(qū)設(shè)置鏈接地址，鼠標(biāo)指向會(huì)顯示。同樣，再用圓形設(shè)置一個(gè)熱區(qū)，就可以再為該圖片設(shè)置其他鏈接了。

3、添加E-mail鏈接

選中需要添加E-mail鏈接的文字或圖片，打開屬性面板，在“鏈接”一格中輸入填寫郵件地址。格式如下：mailto:郵件地址。注意中間不空格。

4、如果鏈接到瀏覽器無法打開的文件，例如exe、Zip等文件，那么瀏覽者在點(diǎn)擊這個(gè)鏈接的時(shí)候，就會(huì)實(shí)現(xiàn)文件下載、或是在線播放的功能。

五、表格的使用

1、點(diǎn)擊插入/表格，打開表格面板進(jìn)行設(shè)置。行數(shù)、列數(shù)、寬度、邊框等，“單元格填充”為單元格內(nèi)側(cè)與內(nèi)容的距離；“單元格間距”為單元格之間的距離，單位均為像素。

2、插入表格后，在表格的邊框上點(diǎn)擊一下，可以全選整個(gè)表格。然后在下面的屬性面板里可以進(jìn)行各種設(shè)置。

3、把光標(biāo)移到其中一個(gè)單元格，此時(shí)看到的屬性面板，就是單元格的屬性面板。也可以進(jìn)行各種關(guān)于單元格的操作。如背景色、背景圖、邊框、合并、拆分等。

六、關(guān)于表格的其他操作

一制作細(xì)線表格 原理：

1、選中整個(gè)表格，設(shè)置其背景為黑色（該顏色即表格線的顏色）。

2、選中所有單元格，設(shè)置其背景為白色。

二自動(dòng)格式化表格

1、先制作好一張表格，然后選中。

2、選菜單中的命令/格式化表格。即可以其中選擇預(yù)設(shè)好的一些表格樣式。

三一像素分割條

1、插入一個(gè)1行1列，寬為200像素，邊框邊距均為0的表格。

2、選中表格，設(shè)置表格高為1像素，并設(shè)置一個(gè)背景色（即所要的線條顏色）。

3、切換到代碼和設(shè)計(jì)窗口，將代碼td 刪除。

七、用表格構(gòu)建完整的頁面

一網(wǎng)頁頂部（一般包括圖標(biāo)、廣告、導(dǎo)航菜單）

1、創(chuàng)建一個(gè)1行2列，寬為760像素，邊框及邊距均為0的表格。

2、選中表格，設(shè)置排列方式為居中對(duì)齊，背景色為#3366CC。

3、將光標(biāo)置于左邊單元格中，設(shè)置其水平排列為左對(duì)齊，垂直排列為頂端對(duì)齊，然后插入一張圖像，一般在此插入的是網(wǎng)站的圖標(biāo)，即logo。

4、將光標(biāo)置于右邊單元格中，設(shè)置其寬度為500，水平排列為居中對(duì)齊，垂直排列為中間，然后插入圖像，一般是網(wǎng)頁廣告，即banner。

5、將光標(biāo)置于剛完成的表格之后，插入/表格，創(chuàng)建一個(gè)1行1列，寬為760像素，邊框及邊距均為0的表格。

6、選中剛創(chuàng)建的表格，設(shè)置排列方式為居中對(duì)齊，背景色為#005173。

7、在該表格中依次插入多個(gè)圖像，作為導(dǎo)航條菜單。

二網(wǎng)頁中部（左邊欄目列表、中間網(wǎng)站新聞、右邊欄目列表）

1、 在導(dǎo)航條表格后面，插入/表格，創(chuàng)建一個(gè)1行3列，寬為760像素，邊框及邊距均為0的表格。并設(shè)置排列方式為居中對(duì)齊，背景色為#FFFFFFF。

2、 將光標(biāo)置于左邊單元格中，設(shè)置其寬度為18%，水平排列為居中對(duì)齊，垂直排列為頂端對(duì)齊，然后插入一張圖像，插入一個(gè)導(dǎo)航條。

3、 將光標(biāo)置于剛插入的圖片后，插入/表格，插入一個(gè)12行1列，寬為90%的表格。設(shè)置其單元格間距為1，背景色為#CCCCCC。

4、 將光標(biāo)放在表格第一個(gè)單元中，設(shè)置其高為20，背景色為#FFFFFF。插入/圖像，插入一個(gè)導(dǎo)航文字前面的小點(diǎn)。同樣設(shè)置其他11個(gè)單元格，這樣左邊的欄目分類列表就完成了。

5、 將光標(biāo)置于主體表格的中間單元格中，設(shè)置其寬度為66%，水平排列為居中對(duì)齊，垂直排列為頂端對(duì)齊，然后插入/圖像，插入一個(gè)導(dǎo)航條。

6、 將光標(biāo)置于圖像后，插入/表格，插入一個(gè)4行1列，寬為95%的表格。設(shè)置其單元格間距為1，背景色為#CCCCCC。

7、 將光標(biāo)置于表格的第一個(gè)單元格中，拖動(dòng)鼠標(biāo)，將4個(gè)單元格都選中，設(shè)置高為60，背景色為#FFFFFF。

8、 將光標(biāo)置于主體表格右邊的單元格中，設(shè)置其寬度為16%，水平排列為居中對(duì)齊，垂直排列為頂端對(duì)齊，插入/圖像，插入一個(gè)導(dǎo)航條。

9、 將光標(biāo)置于圖像后，插入/表格，插入一個(gè)7行一列，寬為90%的表格。設(shè)置其間距為1，背景色為#CCCCCC。

10、按住Ctrl鍵，用鼠標(biāo)點(diǎn)擊剛插入的表格的第1、3、5、7單元格，然后設(shè)置它們的高為55，背景色為#FFFFFF。

11、選中第2、4、6單元格，設(shè)置其高為6，背景色為#FFFFFF。

12、切換到源代碼窗口，將第2、4、6單元格中的空格符號(hào)“ ”刪除。

三網(wǎng)頁底部（一般包括版權(quán)信息及其他相關(guān)內(nèi)容）

1、 將光標(biāo)置于主體表格后，插入/表格，創(chuàng)建一個(gè)2行2列，寬為760像素，邊框及邊距均為0的表格。

2、 選中表格，設(shè)置排列方式為居中對(duì)齊，背景色為#3366CC。

3、 將光標(biāo)置于表格第1行的左邊單元格中，設(shè)置其寬度為50%，水平排列為默認(rèn)，垂直排列為基線，背景色為#FFFFFF，然后輸入版權(quán)信息，內(nèi)容顏色隨便。

4、 將光標(biāo)置于表格第1行右邊單元格中，插入/圖像，插入一個(gè)圓角圖像，在它后面輸入Email字樣，設(shè)置其大小和顏色為1和#FFFFFF。

5、 插入/表單對(duì)象/文本域，插入一個(gè)文本域，寬度可以隨意。

6、 插入/圖像，插入一個(gè)GO的圖像。

7、 設(shè)置頁屬性。點(diǎn)擊菜單修改/頁面屬性，在標(biāo)題一欄中輸入標(biāo)題，并選擇背景圖像，將頂部邊界設(shè)為0。

將整個(gè)網(wǎng)頁分部分放到不同的表格中組合而成，還可以加快瀏覽器讀取頁面的時(shí)間。；因?yàn)闉g覽器是讀完整個(gè)表格后才顯示內(nèi)容的，所以最好不要框在整個(gè)一個(gè)表格中。

八、用布局表格構(gòu)建完整的頁面

1、 單擊插入/布局，里面的布局視圖按鈕，就切換到布局視圖狀態(tài)（默認(rèn)為標(biāo)準(zhǔn)視圖）。也可以用菜單里的查看/表格視圖/布局視圖來進(jìn)入。

2、 先單擊繪制布局表格按鈕，然后在頁面中像繪圖一樣創(chuàng)建出布局表格。

3、 就像上一個(gè)例子一樣，先繪制好網(wǎng)頁的頂部，再中部，再底部的大表格。

4、 再單擊繪制布局單元格按鈕，然后在已經(jīng)繪制好的布局表格中，再繪制布局單元格。

5、 返回到標(biāo)準(zhǔn)視圖，在已經(jīng)劃分好的表格里，再插入嵌套的小的表格，把頁面再細(xì)化，就可以完成整個(gè)頁面的設(shè)計(jì)了。

****注意把整個(gè)頁面都放在一個(gè)大的布局表格中，因?yàn)檫@樣的網(wǎng)頁瀏覽速度會(huì)很慢。應(yīng)該按照頁面的版面和內(nèi)容劃分出幾個(gè)布局表格，然后在其中分別插入布局單元格。

九、層的使用

1、點(diǎn)擊插入/層。也可以點(diǎn)擊圖標(biāo)，然后拖動(dòng)鼠標(biāo)創(chuàng)建出一個(gè)層。

3、選中創(chuàng)建的層，看屬性面板。“層編號(hào)”和“標(biāo)簽”都使用默認(rèn)即可?！皩泳幪?hào)”是編程時(shí)需要用的，我們現(xiàn)在一般不用?！吧稀奔淳囗撁嫔线吔绲木嚯x；“左”是距左邊界的距離。“z軸”是層的順序，數(shù)字大的疊加在數(shù)字小的上面。

****如不設(shè)置顏色時(shí)，層是透明的。

4、點(diǎn)中層左上角的小方框可以隨意拖動(dòng)層，大小也可以調(diào)節(jié)。

5、“溢出”一欄中，當(dāng)文字多于層的大小時(shí)，visible(超出的部分照樣顯示)、hidden(超出部分隱藏)、scroll(不管有否超出，都顯示滾動(dòng)條)、auto(有超出時(shí)才出現(xiàn)滾動(dòng)條)。

6、點(diǎn)擊菜單窗口/其他/層，此時(shí)將出現(xiàn)層管理窗口?？梢栽谄渲行薷膶拥拿Q和Z軸值，也可以點(diǎn)擊眼睛圖標(biāo)使層可見或不可見。還有一個(gè)防止重疊的選項(xiàng)。

7、層的對(duì)齊。按住shift鍵，同時(shí)選中幾個(gè)層。然后用修改/對(duì)齊，用這里的選項(xiàng)。

8、嵌套層。⑴首先在文檔中插入一個(gè)層。⑵將光標(biāo)置于該層內(nèi)，然后繼續(xù)插入一個(gè)層，就得到了嵌套層。⑶里面的叫子層，外面的父層。它們的Z軸順序是一樣的。拖動(dòng)父層時(shí)，子層也會(huì)相對(duì)移動(dòng)。移動(dòng)子層時(shí)，父層不會(huì)隨之移動(dòng)。

十、了解時(shí)間軸

1、點(diǎn)擊菜單中的插入/層，插入一個(gè)層。

2、在層中插入圖片，如一張飛機(jī)的圖片。（這里的圖片也可以是一張小動(dòng)畫的.gif圖像）

3、點(diǎn)擊菜單中的窗口/其他/時(shí)間軸，打開時(shí)間軸窗口。

4、選中頁面上創(chuàng)建的層，用鼠標(biāo)按住層左上角的小方框圖標(biāo)，將層拖放到時(shí)間軸的第1幀中。這時(shí)自動(dòng)創(chuàng)建了一個(gè)長度為15幀的時(shí)間軸。

5、選中時(shí)間軸上的第1幀，將頁面中的層拖放到頁左上角，即動(dòng)畫開始時(shí)的位置。

6、選中時(shí)間軸上第15幀，可以拖動(dòng)該幀至任意長度，如30幀。

7、選中第30幀，將層拖放到頁面的右下方，此時(shí)窗口中顯示出層從第1幀到第30幀的運(yùn)動(dòng)軌跡。(此時(shí)運(yùn)動(dòng)為直線)

8、可以點(diǎn)中第15幀，右鍵選“增加關(guān)鍵幀”，在選中第15幀的狀態(tài)下，拖動(dòng)層到頁面中下方。

9、勾選“自動(dòng)播放”項(xiàng)。

總結(jié)：Dreamweaver是一款很強(qiáng)大的軟件，里面有很多功能需要自己不斷總結(jié)和摸索，熟悉之后就會(huì)很簡單了。

怎么用代碼制作一個(gè)網(wǎng)站

由于目前所見即所得類型的工具越來越多，使用也越來越方便，所以制作網(wǎng)頁已經(jīng)變成了一件輕松的工作，不像以前要手工編寫一行行的源代碼那樣。一般初學(xué)者經(jīng)過短暫的學(xué)習(xí)就可以學(xué)會(huì)制作網(wǎng)頁，于是他們認(rèn)為網(wǎng)頁制作非常簡單，就匆匆忙忙制作自己的網(wǎng)站，可是做出來之后與別人一比，才發(fā)現(xiàn)自己的網(wǎng)站非常粗糙，這是為什么呢？常言道：“性急吃不了熱豆腐”。建立一個(gè)網(wǎng)站就像蓋一幢大樓一樣，它是一個(gè)系統(tǒng)工程，有自己特定的工作流程，你只有遵循這個(gè)步驟，按部就班地一步步來，才能設(shè)計(jì)出一個(gè)滿意的網(wǎng)站。

一、確定網(wǎng)站主題

網(wǎng)站主題就是你建立的網(wǎng)站所要包含的主要內(nèi)容，一個(gè)網(wǎng)站必須要有一個(gè)明確的主題。特別是對(duì)于個(gè)人網(wǎng)站，你不可能像綜合網(wǎng)站那樣做得內(nèi)容大而全，包羅萬象。你沒有這個(gè)能力，也沒這個(gè)精力，所以必須要找準(zhǔn)一個(gè)自己最感興趣內(nèi)容，做深、做透，辦出自己的特色，這樣才能給用戶留下深刻的印象。網(wǎng)站的主題無定則，只要是你感興趣的，任何內(nèi)容都可以，但主題要鮮明，在你的主題范圍內(nèi)內(nèi)容做到大而全、精而深。

二、搜集材料

明確了網(wǎng)站的主題以后，你就要圍繞主題開始搜集材料了。常言道：“巧婦難為無米之炊”。要想讓自己的網(wǎng)站有血有肉，能夠吸引住用戶，你就要盡量搜集材料，搜集得材料越多，以后制作網(wǎng)站就越容易。材料既可以從圖書、報(bào)紙、光盤、多媒體上得來，也可以從互聯(lián)網(wǎng)上搜集，然后把搜集的材料去粗取精，去偽存真，作為自己制作網(wǎng)頁的素材。

三、規(guī)劃網(wǎng)站

一個(gè)網(wǎng)站設(shè)計(jì)得成功與否，很大程度上決定于設(shè)計(jì)者的規(guī)劃水平，規(guī)劃網(wǎng)站就像設(shè)計(jì)師設(shè)計(jì)大樓一樣，圖紙?jiān)O(shè)計(jì)好了，才能建成一座漂亮的樓房。網(wǎng)站規(guī)劃包含的內(nèi)容很多，如網(wǎng)站的結(jié)構(gòu)、欄目的設(shè)置、網(wǎng)站的風(fēng)格、顏色搭配、版面布局、文字圖片的運(yùn)用等，你只有在制作網(wǎng)頁之前把這些方面都考慮到了，才能在制作時(shí)駕輕就熟，胸有成竹。也只有如此制作出來的網(wǎng)頁才能有個(gè)性、有特色，具有吸引力。如何規(guī)劃網(wǎng)站的每一項(xiàng)具體內(nèi)容，我們?cè)谙旅鏁?huì)有詳細(xì)介紹。 四、選擇合適的制作工具

盡管選擇什么樣的工具并不會(huì)影響你設(shè)計(jì)網(wǎng)頁的好壞，但是一款功能強(qiáng)大、使用簡單的軟件往往可以起到事半功倍的效果。網(wǎng)頁制作涉及的工具比較多，首先就是網(wǎng)頁制作工具了，目前大多數(shù)網(wǎng)民選用的都是所見即所得的編輯工具，這其中的優(yōu)秀者當(dāng)然是Dreamweaver和Frontpage了，如果是初學(xué)者，F(xiàn)rontpage2000是首選。除此之外，還有圖片編輯工具，如Photoshop、Photoimpact等；動(dòng)畫制作工具，如Flash、Cool 3d、Gif Animator等；還有網(wǎng)頁特效工具，如有聲有色等，網(wǎng)上有許多這方面的軟件，你可以根據(jù)需要靈活運(yùn)用。

五、制作網(wǎng)頁

材料有了，工具也選好了，下面就需要按照規(guī)劃一步步地把自己的想法變成現(xiàn)實(shí)了，這是一個(gè)復(fù)雜而細(xì)致的過程，一定要按照先大后小、先簡單后復(fù)雜來進(jìn)行制作。所謂先大后小，就是說在制作網(wǎng)頁時(shí)，先把大的結(jié)構(gòu)設(shè)計(jì)好，然后再逐步完善小的結(jié)構(gòu)設(shè)計(jì)。所謂先簡單后復(fù)雜，就是先設(shè)計(jì)出簡單的內(nèi)容，然后再設(shè)計(jì)復(fù)雜的內(nèi)容，以便出現(xiàn)問題時(shí)好修改。在制作網(wǎng)頁時(shí)要多靈活運(yùn)用模板，這樣可以大大提高制作效率。

六、上傳測(cè)試

網(wǎng)頁制作完畢，最后要發(fā)布到Web服務(wù)器上，才能夠讓全世界的朋友觀看，現(xiàn)在上傳的工具有很多，有些網(wǎng)頁制作工具本身就帶有FTP功能，利用這些FTP工具，你可以很方便地把網(wǎng)站發(fā)布到自己申請(qǐng)的主頁存放服務(wù)器上。網(wǎng)站上傳以后，你要在瀏覽器中打開自己的網(wǎng)站，逐頁逐個(gè)鏈接的進(jìn)行測(cè)試，發(fā)現(xiàn)問題，及時(shí)修改，然后再上傳測(cè)試。全部測(cè)試完畢就可以把你的網(wǎng)址告訴給朋友，讓他們來瀏覽。

七、推廣宣傳

網(wǎng)頁做好之后，還要不斷地進(jìn)行宣傳，這樣才能讓更多的朋友認(rèn)識(shí)它，提高網(wǎng)站的訪問率和知名度。推廣的方法有很多，例如到搜索引擎上注冊(cè)、與別的網(wǎng)站交換鏈接、加入廣告鏈等。

八、維護(hù)更新

制作網(wǎng)頁的所有代碼和代碼意思

這個(gè)最全 [編輯本段]HTML規(guī)范 一、 HTML 頭： 1、針對(duì)日文環(huán)境： !DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01Transitional//EN" html lang="ja" head meta http-equiv="Content-Type" content="text/html; charset=EUC-JP" meta http-equiv="Content-Script-Type" content="text/javascript" meta http-equiv="Content-Style-Type" content="text/css" titleyourtitle/title /head 2、針對(duì)中文環(huán)境： !DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01Transitional//EN" head meta http-equiv="Content-Type" content="text/html; charset=GB2312" meta http-equiv="Content-Script-Type" content="text/javascript" meta http-equiv="Content-Style-Type" content="text/css" titleyourtitle/title /head 我們建議的編碼格式是utf-8，它支持多語種，并且可以避免出現(xiàn)亂碼的情況。 二、html中javascript的書寫： head….. script type="text/javascript" !—…..-- /script /head 當(dāng)然我們不希望你是這樣內(nèi)嵌教本，而是從一個(gè)外部文件進(jìn)行引用，并且只把它放在文檔的頭部。 script src="path/to/script.js" language="javascript" type="text/javascript"/script 三、html中元素的書寫： 1、 元素屬性值必須包含在雙引號(hào)中； font color=”#000000” size=”3” face=”Arial” 2、 form 中必須加action屬性，并且不能為空。 form action=”/r/add.cgi” method=”post” 如果不需要使用action屬性，也必須定義： form action=”no” 3、 img的alt屬性不可以缺少； img src="/q/img/btn_style.gif" border="0" alt="Select” 4、 head與/head之間必須有title； head …… titleyour title /title …… /head 5、 tr、td必須定義在table之間； 6、 button按鈕必須定義在form之間，否則netscape不支持； form action=”……” method=”post” input type=”button” name=”but” value=”back” /form 7、 在javascript中的字符串中出現(xiàn)的“/”前要用轉(zhuǎn)義符“\”： script type=”text/javascript” !— function check(str) { var str=”\/r\/add.cgi”; …… } -- /script 8、 onclick 屬性必須和 onkeypress 成對(duì)寫( onmousedown + onkeydown、onmouseup + onkeyup) mm 9、 用URL傳值時(shí)直接寫是不可以的，可用替換： 四、縮近規(guī)則： 中,等必須保持嚴(yán)格的縮近規(guī)則，以"Tab"鍵為準(zhǔn)： 五、為了檢驗(yàn)?zāi)腍TML代碼是否合法，您可以到W3的HTML Validator工具中進(jìn)行檢驗(yàn)，支持URI輸入，上傳文件和直接輸入代碼三種方式進(jìn)行檢驗(yàn) [編輯本段]HTML元素參考手冊(cè) （HTML Elements Referencea） 表示超鏈接的起始或目的位置。 acronym 表示取首字母的縮寫詞。 address 表示特定信息，如地址、簽名、作者、文檔信息。 applet 在頁面上放置可執(zhí)行內(nèi)容。 area 定義一個(gè)客戶端圖像映射中一個(gè)超級(jí)鏈接區(qū)域的形狀、坐標(biāo)和關(guān)聯(lián) URL。 b 指定文本應(yīng)以粗體顯示。（不建議使用） base 指定一個(gè)顯式 URL 用于解析對(duì)于外部源的鏈接和引用，如圖像和樣式表。 basefont 設(shè)置顯示文本時(shí)作為默認(rèn)字體的基礎(chǔ)字體值。（不建議使用） bdo 允許作者為選定文本片斷禁用雙向法則。 bgsound 使頁面能夠帶有背景聲音或配音。 big 指定所含文本要以比當(dāng)前字體稍大的字體顯示。 blockquote 表示文本中的一段引用語。 body 指明文檔主體的開始和結(jié)束。 br 插入一個(gè)換行符。 button 指定一個(gè)容器，其中所含的 HTML 會(huì)被顯示為一個(gè)按鈕。 caption 表格的標(biāo)題，對(duì)表格的簡單描述。 center 將指定文本和圖像居中顯示。（不建議使用） cite 用斜體顯示標(biāo)明引文。（不建議使用） code 表示代碼范例。 col 說明基于列的表格缺省屬性。 colgroup 說明表格中一列或一組列的缺省屬性。 comment 表示不可見的注釋。防止所包含的文本或者HTML源代碼被瀏覽器解析和顯示。 dd 在定義列表中表示定義。定義通常在定義列表中縮進(jìn)顯示。 del 表示文本已經(jīng)從文檔中刪除。 dfn 表示術(shù)語的定義。（不建議使用） dir 表示目錄列表。（不建議使用） div 表示一塊可顯示 HTML 的區(qū)域 dl 表示定義列表。 dt 在定義列表中表示定義術(shù)語。 em 強(qiáng)調(diào)文本，通常以斜體顯示。 embed 允許嵌入任何類型的文檔。 fieldset 在字段集包含的文本和其它元素外面畫一個(gè)方框。 font 用于說明所包含文本的新字體、大小和顏色。 form 說明所包含的控件是某個(gè)表單的組成部分。 frame 在FRAMESET 元素內(nèi)表示單個(gè)框架。 frameset 表示一個(gè)框架集，用于組織多個(gè)框架和嵌套框架集。 head 提供了關(guān)于文檔的無序信息集合。 h1-h6 這實(shí)際上是6個(gè)標(biāo)簽，他們以標(biāo)題樣式顯示文本，h1最大，h6最小。 hr 水平線。 html 表明文檔包含 HTML 元素。 i 指定文本應(yīng)以斜體顯示。（不建議使用） iframe 創(chuàng)建內(nèi)嵌漂浮框架。 img 在文檔中嵌入圖像或視頻片斷。 input 創(chuàng)建各種表單輸入控件。 input type=button 創(chuàng)建按鈕控件。 input type=checkbox 創(chuàng)建復(fù)選框控件。 input type=file 創(chuàng)建文件上載控件，該控件帶有一個(gè)文本框和一個(gè)瀏覽按鈕。 input type=hidden 傳輸關(guān)于客戶/服務(wù)器交互的狀態(tài)信息。 input type=image 創(chuàng)建一個(gè)圖像控件，該控件被點(diǎn)擊后將導(dǎo)致表單立即被提交。 input type=password 創(chuàng)建與 INPUT type=text 控件類似的單行文本輸入控件，不過并不顯示用戶輸入的內(nèi)容。 input type=radio 創(chuàng)建單選鈕控件。 input type=reset 創(chuàng)建一個(gè)按鈕，點(diǎn)擊該按鈕后，將重置表單控件回其初始值。 input type=submit 創(chuàng)建一個(gè)按鈕，點(diǎn)擊該按鈕后，即提交表單。 input type=text 創(chuàng)建一個(gè)單行的文本輸入控件。 ins 表示插入到文檔中的文本。 isindex 使瀏覽器顯示一個(gè)對(duì)話框，提示用戶輸入單行文本。（不建議使用） kbd 以定寬字體顯示文本。（不建議使用） label 為頁面上的其它元素指定標(biāo)簽。 legend 在fieldSet 對(duì)象繪制的方框內(nèi)插入一個(gè)標(biāo)題。 li 表示列表中的一個(gè)項(xiàng)目。 link 允許當(dāng)前文檔和外部文檔建立連接。 listing 以固定寬度的字體顯示文本。 map 包含客戶端圖像映射的坐標(biāo)數(shù)據(jù)。 marqueee 創(chuàng)建一個(gè)滾動(dòng)的文本字幕。（不建議使用） menu 創(chuàng)建一個(gè)無序列表。 meta 向服務(wù)器和客戶端傳達(dá)關(guān)于文檔的隱藏信息。 nobr 不換行顯示文本。 noframes 包含對(duì)于那些不支持 FRAMESET 元素的瀏覽器使用的 HTML。 noscript 指定在不支持腳本的瀏覽器中顯示的 HTML。 object 在HTML 頁面中插入對(duì)象。 ol 編制排序列表。 optgroup 允許作者對(duì) select 元素中的選項(xiàng)進(jìn)行邏輯分組。 option 表示SELECT 元素中的一個(gè)選項(xiàng)。 p 表示一段。 param 設(shè)置APPLET、EMBED 或 OBJECT 元素的屬性初始值。 pre 以固定寬度字體顯示文本。 q 分離文本中的引語。 s 帶刪除線方式顯示文本。（不建議使用） samp 表示代碼范例。 script 指定由腳本引擎解釋的頁面中的腳本。 select 表示一個(gè)列表框或者一個(gè)下拉框。 small 指定內(nèi)含文本要以比當(dāng)前字體稍小的字體顯示。 span 指定內(nèi)嵌文本容器。 strike 帶刪除線顯示文本。（不建議使用） strong 以粗體顯示文本。 style 指定頁面的樣式表。 sub 說明內(nèi)含文本要以下標(biāo)的形式顯示，比當(dāng)前字體稍小。 sup 說明內(nèi)含文本要以上標(biāo)的形式顯示，比當(dāng)前字體稍小。 table 說明所含內(nèi)容組織成含有行和列的表格形式。 tbody 指明哪些行作為表格的主體。 td 指定表格中的單元格。 textarea 多行文本輸入控件。 tfoot 指明哪些行作為表尾。 th 指定標(biāo)題列。標(biāo)題列將在單元格中居中并以粗體顯示。 thead 指定哪些行作為表頭。 title 文檔的標(biāo)題。 tr 指定表格中的一行。 tt 以固定寬度字體顯示文本。（不建議使用） u 帶下劃線顯示文本。（不建議使用） ul 表示不排序的項(xiàng)目列表。 var 定義程序變量，通常以斜體顯示。 wbr 向一塊 NOBR 文本中插入軟換行。

web制作網(wǎng)站的代碼的介紹就聊到這里吧，感謝你花時(shí)間閱讀本站內(nèi)容，更多關(guān)于編寫網(wǎng)頁的代碼、web制作網(wǎng)站的代碼的信息別忘了在本站進(jìn)行查找喔。