本篇文章給大家談談web制作網站的代碼，以及編寫網頁的代碼對應的知識點，希望對各位有所幫助，不要忘了收藏本站喔。

本文目錄一覽：

• 1、急求?。?！網頁設計 HTML代碼大全
• 2、怎樣用Dreamweaver套用網站源代碼制作網頁
• 3、怎么用代碼制作一個網站
• 4、制作網頁的所有代碼和代碼意思

急求?。。【W頁設計 HTML代碼大全

HTML標記_HTML大全_HTML標記大全_超文本標記語言

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

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

標 簽 內 容 備 注

基 本 標 簽 所有HTML文件都有的

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

head……/head 設置文檔描述及其他不在WEB網頁上顯示的信息

body……/body HTML文檔的主體（頁面的實際內容）

標 題 標 簽 　

title……/title 在標題欄中顯示的題目（放在head/head內）

擴 展 屬 性 標 簽 　

base

基址標簽，為解決相對編址作參考值

META

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

link

提供將現行文檔與其它文檔或實體關聯起來的信息

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

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

頁 面 屬 性 標 簽 body……/body標簽的擴展屬性。使用詳解

body bgcolor=#…… 設置背景顏色，用名字或十六進制值

body text=#…… 設置文本文字顏色，用名字或十六進制值

body link=#…… 設置鏈接顏色，用名字或十六進制值

body vlink=#…… 設置已使用的鏈接的顏色，用名字或十六進制值

body alink=#…… 設置正在被擊中鏈接的顏色，用名字或十六進制值

文 本 標 簽 　

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

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

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

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

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

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

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

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

strong……/strong 強調（通常是斜體加黑體）

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

font color=……/font 設置字體的顏色，使用名字或十六進制值

鏈 接 　

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

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

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

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

格 式 排 版 　

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

p align=…… 將段落按左、中、右對齊

br 插入一個回車換行符

blockquote……/blockquote 從兩邊縮進文本

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

dt 放在每個定義術語詞之前

dd 放在每個定義之前

ol……/ol 創(chuàng)建一個標有數字的列表

li 放在每個數字列表項之前，并加上一個數字

ul……/ul 創(chuàng)建一個標有圓點的列表

li 放在每個圓點列表項之前，并加上一個圓點

div align=…… 一個用來排版大塊HTML段落的標簽，也用于格式化表

圖 形 元 素 　

img src="/name" 添加一個圖像

img src="/name" align=value 排列對齊一個圖像：左中右或上中下

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

hr 加入一條水平線

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

hr width=value 設置水平線的寬度（百分比或絕對像素點）

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

表 格 　

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

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

td……/td 開始一行中的每一個格子

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

表 格 屬 性 　

table border=value 設置圍繞表格的邊框的寬度

table cellspacing=value 設置表格格子之間空間的大小

table cellpadding=value 設置表格格子邊框與其內部內容之間空間的大小

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

tr align=…… 設置表格格子的水平對齊（左中右）

tr valign=…… 設置表格格子的垂直對齊（上中下）

td colspan=value 設置一個表格格子應跨占的列數（缺省為1）

td rowspan=value 設置一個表格格子應跨占的行數（缺省為1）

td nowrap 禁止表格格子內的內容自動斷行回卷

窗 框 　

frameset……/frameset 放在一個窗框文檔的body標簽之前，也可以嵌在其他窗框文檔中

frameset rows="value,value" 定義一個窗框內的行數，可以使用絕對像素值或高度的百分比

frameset cols="value,value" 定義一個窗框內的列數，可以使用絕對像素值或寬度的百分比

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

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

窗 框 屬 性 　

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

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

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

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

frame scrolling=value 設置窗框是否有滾動欄，其值可以是"yes","no","auto"，缺省時一般為"auto"

frame noresize 禁止用戶調整一個窗框的大小

表 單 對于功能性的表單，一般需要運行一個CGI小程序，HTML僅僅是產生表單的表面樣子。

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

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

option 設置每個表單項的內容

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

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

input type="checkbox" name="NAME" 創(chuàng)建一個復選框，文字在標簽后面

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

input type=text name="……" size=value 創(chuàng)建一個單行文本輸入區(qū)域，size設置以字符計的寬度

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

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

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

附 加 屬 性 　

PRE……/PRE 預置格式風格標簽用來顯示字體寬度固定的文本塊，主要用來在表格格式中顯示文本

TT……/TT 打字機風格用來顯示打字機字體寬度固定的文本

SAMP……/SAMP 示例風格以單倍距顯示文本

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

DL……/DL 定義列表風格用來顯示術語及其定義

顏色

#=rrggbb 16 進制 RGB 數值，或者是下列預定義色彩：

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

META標簽

描述不包含在標準HTML里的文檔信息。

META NAME="keywords" CONTENT="yourkeyword"

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

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

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

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

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

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

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

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

LINK

顯示本文檔和其他文檔之間的連接關系。一個最有用的應用就是外部層疊樣式表的定位。格式如下：

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

BASE

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

BODY

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

ALINK：當前激活的連接的文字顏色。

LINK：連接的文字顏色。

TEXT：文字的顏色。

VLINK：參觀過的文字顏色。

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

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

BACKGROUND：背景圖案，該圖案在頁面內平鋪。背景圖案應保持單一色調，以保證頁面文字易于閱讀。

BGPROPERTIES：設置成FIXED，則背景圖案不滾動。（只對INTERNET EXPLORER有效）

BGCOLOR：背景色。

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

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

LEFTMARGIN：左邊頁邊空白。

TOPMARGIN：頂端頁邊空白。

怎樣用Dreamweaver套用網站源代碼制作網頁

用Dreamweaver套用網站源代碼制作網頁方法：

一、定義站點

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

備注：網站中所用的文件都要用英文名。

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

備注：再次打開Dreamweaver，會自動找到剛才設立的站點。如果有多個站點，可以在菜單“站點—打開站點”中去選擇。

二、創(chuàng)建頁面

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

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

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

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

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

在網頁上最常用的是宋體字。不要將特殊的字體加到列表中使用，因為別人電腦上未裝就看不到。如果需要用的話，要做成圖片后再使用。

在網頁上打入空格的辦法是：把輸入法調為全角。

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

三、為頁面添加圖片

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

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

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

4、“鏈接”可以直接在這里輸入地址。“替代”是圖片的說明，即鼠標指向圖片所顯示的文字；“邊框”是圖片邊框寬度，“對齊”是對齊方式。

四、添加超級鏈接

1、為文字添加鏈接。

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

2、為圖片添加鏈接

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

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

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

3、添加E-mail鏈接

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

4、如果鏈接到瀏覽器無法打開的文件，例如exe、Zip等文件，那么瀏覽者在點擊這個鏈接的時候，就會實現文件下載、或是在線播放的功能。

五、表格的使用

1、點擊插入/表格，打開表格面板進行設置。行數、列數、寬度、邊框等，“單元格填充”為單元格內側與內容的距離；“單元格間距”為單元格之間的距離，單位均為像素。

2、插入表格后，在表格的邊框上點擊一下，可以全選整個表格。然后在下面的屬性面板里可以進行各種設置。

3、把光標移到其中一個單元格，此時看到的屬性面板，就是單元格的屬性面板。也可以進行各種關于單元格的操作。如背景色、背景圖、邊框、合并、拆分等。

六、關于表格的其他操作

一制作細線表格 原理：

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

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

二自動格式化表格

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

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

三一像素分割條

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

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

3、切換到代碼和設計窗口，將代碼td 刪除。

七、用表格構建完整的頁面

一網頁頂部（一般包括圖標、廣告、導航菜單）

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

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

3、將光標置于左邊單元格中，設置其水平排列為左對齊，垂直排列為頂端對齊，然后插入一張圖像，一般在此插入的是網站的圖標，即logo。

4、將光標置于右邊單元格中，設置其寬度為500，水平排列為居中對齊，垂直排列為中間，然后插入圖像，一般是網頁廣告，即banner。

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

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

7、在該表格中依次插入多個圖像，作為導航條菜單。

二網頁中部（左邊欄目列表、中間網站新聞、右邊欄目列表）

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

2、 將光標置于左邊單元格中，設置其寬度為18%，水平排列為居中對齊，垂直排列為頂端對齊，然后插入一張圖像，插入一個導航條。

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

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

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

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

7、 將光標置于表格的第一個單元格中，拖動鼠標，將4個單元格都選中，設置高為60，背景色為#FFFFFF。

8、 將光標置于主體表格右邊的單元格中，設置其寬度為16%，水平排列為居中對齊，垂直排列為頂端對齊，插入/圖像，插入一個導航條。

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

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

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

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

三網頁底部（一般包括版權信息及其他相關內容）

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

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

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

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

5、 插入/表單對象/文本域，插入一個文本域，寬度可以隨意。

6、 插入/圖像，插入一個GO的圖像。

7、 設置頁屬性。點擊菜單修改/頁面屬性，在標題一欄中輸入標題，并選擇背景圖像，將頂部邊界設為0。

將整個網頁分部分放到不同的表格中組合而成，還可以加快瀏覽器讀取頁面的時間。；因為瀏覽器是讀完整個表格后才顯示內容的，所以最好不要框在整個一個表格中。

八、用布局表格構建完整的頁面

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

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

3、 就像上一個例子一樣，先繪制好網頁的頂部，再中部，再底部的大表格。

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

5、 返回到標準視圖，在已經劃分好的表格里，再插入嵌套的小的表格，把頁面再細化，就可以完成整個頁面的設計了。

****注意把整個頁面都放在一個大的布局表格中，因為這樣的網頁瀏覽速度會很慢。應該按照頁面的版面和內容劃分出幾個布局表格，然后在其中分別插入布局單元格。

九、層的使用

1、點擊插入/層。也可以點擊圖標，然后拖動鼠標創(chuàng)建出一個層。

3、選中創(chuàng)建的層，看屬性面板?！皩泳幪枴焙汀皹撕灐倍际褂媚J即可?！皩泳幪枴笔蔷幊虝r需要用的，我們現在一般不用?！吧稀奔淳囗撁嫔线吔绲木嚯x；“左”是距左邊界的距離?！皕軸”是層的順序，數字大的疊加在數字小的上面。

****如不設置顏色時，層是透明的。

4、點中層左上角的小方框可以隨意拖動層，大小也可以調節(jié)。

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

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

7、層的對齊。按住shift鍵，同時選中幾個層。然后用修改/對齊，用這里的選項。

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

十、了解時間軸

1、點擊菜單中的插入/層，插入一個層。

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

3、點擊菜單中的窗口/其他/時間軸，打開時間軸窗口。

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

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

6、選中時間軸上第15幀，可以拖動該幀至任意長度，如30幀。

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

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

9、勾選“自動播放”項。

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

怎么用代碼制作一個網站

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

一、確定網站主題

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

二、搜集材料

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

三、規(guī)劃網站

一個網站設計得成功與否，很大程度上決定于設計者的規(guī)劃水平，規(guī)劃網站就像設計師設計大樓一樣，圖紙設計好了，才能建成一座漂亮的樓房。網站規(guī)劃包含的內容很多，如網站的結構、欄目的設置、網站的風格、顏色搭配、版面布局、文字圖片的運用等，你只有在制作網頁之前把這些方面都考慮到了，才能在制作時駕輕就熟，胸有成竹。也只有如此制作出來的網頁才能有個性、有特色，具有吸引力。如何規(guī)劃網站的每一項具體內容，我們在下面會有詳細介紹。 四、選擇合適的制作工具

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

五、制作網頁

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

六、上傳測試

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

七、推廣宣傳

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

八、維護更新

制作網頁的所有代碼和代碼意思

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

web制作網站的代碼的介紹就聊到這里吧，感謝你花時間閱讀本站內容，更多關于編寫網頁的代碼、web制作網站的代碼的信息別忘了在本站進行查找喔。