1. 網(wǎng)頁制作概述：
1、制作網(wǎng)頁的常用技術(shù)：
（1）HTML：HTML，Hypertext Markup Language埃撵，超文本至標(biāo)語言；文本類虽另，解釋執(zhí)行的至標(biāo)語言暂刘；是Internet上用于編寫靜態(tài)頁面的主要語言，是網(wǎng)頁制作的基礎(chǔ)捂刺。
（2）CSS：CSS谣拣，Cascading Style Sheets，級聯(lián)樣式表族展；用于增強網(wǎng)頁樣式并允許將樣式信息與網(wǎng)頁內(nèi)容分離的一種至標(biāo)語言森缠；是一種專門有關(guān)網(wǎng)頁樣式描述的文件，不關(guān)心網(wǎng)頁的內(nèi)容仪缸，網(wǎng)頁的“外衣”贵涵，通過操縱編輯來改變其內(nèi)容來靈活改變網(wǎng)頁的外觀布局。
（3）CGI：CGI恰画，Common Gateway Interface宾茂，公共網(wǎng)關(guān)接口；是HTTP服務(wù)器與其他機器上的程序進行“交談”的一種工具拴还，其程序必修運行在網(wǎng)絡(luò)服務(wù)器上跨晴，CGI程序使網(wǎng)頁具有交互能力。
（4）JavaScript：JavaScript是由Netscape公司開發(fā)片林，目前流行的網(wǎng)絡(luò)腳本語言端盆。用于開發(fā)動態(tài)的頁面，功能強大费封』烂睿可以直接應(yīng)用與HTML文檔，在客戶端執(zhí)行以獲得動態(tài)交互式效果孝偎，還可以運行于服務(wù)器端访敌，代替?zhèn)鹘y(tǒng)的CGI程序。
（5）Java Applet：使用Java語言編寫的一些小應(yīng)用程序衣盾，它們可以直接嵌入網(wǎng)頁寺旺，產(chǎn)生特殊的效果。
（6）VBScript：也是一種腳本語言，是ASP（Active Server Pages，活動服務(wù)器頁）默認(rèn)使用的語言巷蚪；由微軟開發(fā)的一種通用腳本語言军俊，只能被IE瀏覽器支持憾朴。
（7）JScript：最早的形式是Netscape的JavaScript，然后在此基礎(chǔ)上出現(xiàn)了ECMA（European Computer Manufactures Association）-262 『闵担現(xiàn)在JavaScript和JScript就是ＥＣＭＡ－262 標(biāo)準(zhǔn)由不同公司實現(xiàn)的版本澈驼。
（8）ASP：提供了一種服務(wù)器端腳本編寫環(huán)境和服務(wù)器執(zhí)行端執(zhí)行指令的環(huán)境走搁，是附加特性擴展了標(biāo)準(zhǔn)的HTML文件独柑。ASP頁面可以使用腳本語言（默認(rèn)是VBScript）；使用它可以創(chuàng)建和運行動態(tài)私植、交互的Web服務(wù)器應(yīng)用程序忌栅。
（9）PHP：PHP，Hypertext Preprocessor曲稼，超文本預(yù)處理語言索绪；是一種內(nèi)嵌在HTML頁面內(nèi)的腳本語言，靜態(tài)的HTML標(biāo)記和PHP程序一起組成了動態(tài)Web頁面贫悄。
（10）JSP：Java Server Pages瑞驱，Java服務(wù)器頁；一種動態(tài)網(wǎng)頁技術(shù)標(biāo)準(zhǔn)窄坦，是由SUN公司倡導(dǎo)并在許多公司參與下共同建立的一種動態(tài)網(wǎng)頁技術(shù)標(biāo)準(zhǔn)唤反。
（11）CFML：Cold Fusion Markup Language，冷聚變置標(biāo)語言嫡丙；穩(wěn)定拴袭、可靠的Web應(yīng)用服務(wù)平臺读第。
（12）XML：Extensible Markup Language曙博，可擴展的置標(biāo)語言；是W3C組織發(fā)布的標(biāo)準(zhǔn)怜瞒，它是一個精簡的SGML（標(biāo)準(zhǔn)通用置標(biāo)語言）父泳。
（13）ASP.NET：是Microsoft.NET的一部分，是ASP的新版本吴汪，還提供了一個統(tǒng)一的Web開發(fā)模型惠窄。
（14）Web數(shù)據(jù)庫：通過SQL命令對后臺數(shù)據(jù)庫進行各種操作。
? ? ? ? 常用的后臺數(shù)據(jù)庫有：
? ? ? ? ? 1）Microsoft SQL Server：需要Windows操作系統(tǒng)的支持漾橙，適合不太大的系統(tǒng)杆融。
? ? ? ? ? 2）Oracle：可以跨平臺進行，適合較復(fù)雜的大型系統(tǒng)霜运。
? ? ? ? ? 3）Microsoft Access：需要Windows操作系統(tǒng)脾歇，一般小型的，簡單的系統(tǒng)淘捡。
2藕各、網(wǎng)頁制作的常用工具：
（1）網(wǎng)頁設(shè)計“三劍客”：Macromedia Dreamweaver系列、Firework系列焦除、Flash系列的組合激况。（Dreamweaver用于設(shè)計站點和頁面；Firework用于處理靜態(tài)圖片或簡單的動態(tài)圖片；Flash用于制作動畫乌逐。）
（2）Microsoft FrontPage 2003竭讳、Photo Express系列、Adobe Photoshop系列的組合浙踢。（FrontPage系列用于各種特殊效果的靜態(tài)圖片處理代咸。）
（3）Microsoft InterDew（Web應(yīng)用程序開發(fā)平臺）。這是微軟的一個綜合開發(fā)環(huán)境成黄，在此平臺上可以進行項目管理呐芥、站點管理、頁面設(shè)計奋岁、網(wǎng)絡(luò)編程思瘟、調(diào)試等。
2. HTML 概述：
1闻伶、HTML語言簡介：
HTML語言是一種簡易的文件交換標(biāo)準(zhǔn)滨攻，有別于物理的文件結(jié)構(gòu)，旨在定義文件內(nèi)的對象和描述文件的邏輯結(jié)構(gòu)蓝翰，而并不定義文件的顯示光绕。
HTML是純文本類型語言，使用HTML編寫的網(wǎng)頁文件也是標(biāo)準(zhǔn)的純文本文件畜份，可以直接被瀏覽器解釋執(zhí)行诞帐，無須編譯。
2爆雹、HTML基本標(biāo)記及HTML文檔框架：
HTML標(biāo)記的一般形式：
開始標(biāo)記——要描述的內(nèi)容——/結(jié)束標(biāo)記
HTML文檔都是以 html 標(biāo)記開始停蕉，并且以相匹配的 /html 標(biāo)記結(jié)束。
HTML文檔主要分為兩個部分：頭部（Head）和主體（Body）钙态。
標(biāo)記對 head 和 /head 之間的內(nèi)容不會在瀏覽器頁面中顯示慧起，為頭部部；其內(nèi)容是關(guān)于此文檔的相關(guān)信息册倒，如文檔的標(biāo)題蚓挤，也是 title 和 /title 之間的文本。
body 和/body 標(biāo)記之間包含的內(nèi)容將出現(xiàn)在Web頁面上驻子，為網(wǎng)頁的主體部分灿意；這部分內(nèi)容可能要在瀏覽器的窗口中顯示，屬于文檔“流”拴孤。
在此標(biāo)記之間可包含 ｐ和 /p脾歧，h 和 /h ，br 和 /hr 等標(biāo)記演熟，它描述的是正文信息鞭执，如標(biāo)題司顿、段落、列表和表格兄纺。
除了文檔等頭部和主體外大溜，典型的HTML文檔還包含注釋。
這些注釋是文檔作者寫給自己和其他人看的估脆，起到說明的作用钦奋；盡管出現(xiàn)在文檔中，但是它們不會被解釋疙赠，也不能被顯示付材，不以任何方式改變標(biāo)記和文檔的功能。
注釋形式： 圃阳！- - 【被注釋的內(nèi)容】- -
3厌衔、HTML標(biāo)記類型：
HTML的標(biāo)記從功能上大致分為三類：
（1）結(jié)構(gòu)性的標(biāo)記：標(biāo)記布置文檔的結(jié)構(gòu)。（如：段落標(biāo)記 ｐ和標(biāo)題標(biāo)記 head 就是結(jié)構(gòu)性標(biāo)記）
（2）樣式性的標(biāo)記：其描述對應(yīng)內(nèi)容被顯示時應(yīng)采用的樣式捍岳。（相當(dāng)多的HTML標(biāo)記用于樣式化的顯示富寿，如：粗體標(biāo)記 b 屬于樣式性標(biāo)記；一般情況下锣夹，不鼓勵使用樣式性標(biāo)記）
（3）描述性的標(biāo)記：用來描述元素的性質(zhì)页徐，如：title標(biāo)記。
4银萍、HTML的編輯和運行：
根據(jù)HTML語法所寫出來的文件稱為HTML文件变勇，其文件的擴展名為 .html 或 .htm 。
HTML文件時純文本文件砖顷，可以使用任何一個文本編輯器（記事本或?qū)懽职澹┻M行編輯贰锁，然后通過瀏覽器來解釋執(zhí)行赃梧。
HTML文件時運行在Web瀏覽器上的滤蝠；在使用瀏覽器運行HTML文件時，可以在地址欄輸入文件的地址即URL后打開授嘀，或直接用IE瀏覽器打開物咳。
瀏覽器打開之后的結(jié)果顯示如下：
3. HTML 的常用標(biāo)記及其屬性：
1、HTML的文本格式標(biāo)記及其屬性：
HTML的文本標(biāo)記是有關(guān)文本輸出的格式的標(biāo)記蹄皱，如文本輸出的字體览闰、是否斜體、是否加下劃線等巷折。
（1）pre - /pre：標(biāo)記用來對文本進行預(yù)處理操作压鉴。
（2）b - /b、i - /i锻拘、u - /u：b——表示加粗油吭；i——表示斜體击蹲；u——表示下劃線。
（3）tt - /tt婉宰、cite - /cite歌豺、em - /em、strong - /strong：tt——輸出打字機風(fēng)格字體心包；cite——輸出引用方式等字體类咧，通常斜體；em——輸出強調(diào)的文本（斜體加粗）蟹腾；strong——輸出加重了的文本（通常也是斜體加粗）痕惋。
（4）blockquote - /blackquote：標(biāo)記對之間加入的文本將會在瀏覽器中按兩邊縮進的方式顯示出來。
（5）font - /font：可以對輸出文本的字體大小娃殖、顏色進行修改血巍。size屬性用來改變字體的大小，可取值為-1珊随、1和+1述寡；而color屬性則用來改變文本的顏色，顏色的取值可以是十六進制RGB顏色碼或HTML語言給定的顏色常量名：
auque? black? blue? fuchsia? grey? green? lime? maroon? navy? olive? purple? red? teal? silver? white? yellow
2叶洞、圖像標(biāo)記及其屬性：
使用 img 標(biāo)記并對其src屬性賦值將圖像添加到頁面中鲫凶。
注意圖形文件所在的路徑：當(dāng)HTML文件與圖像文件（文件名假設(shè)logo.gif）在同一個目錄下，則代碼為img src=“l(fā)ogo.gif”? 當(dāng)圖像文件放在HTML文檔所在目錄的一個子目錄（假設(shè)子目錄名images）下衩辟，則代碼為 img src=“images/logo.gif” 螟炫；? 當(dāng)圖像文件放在HTML文檔所在目錄的父目錄（假設(shè)父目錄名home）中，則代碼為 img src=“ . . /home艺晴、logo.gif” 昼钻。
強調(diào)一下：src屬性在 img 標(biāo)記中是必須賦值的！是標(biāo)記中不可缺少的一部分封寞。
3然评、超鏈接標(biāo)記及其屬性：
超鏈接——創(chuàng)建超鏈接的HTML標(biāo)記對是 a - /a；其格式為：a href =“ ”? ······? /a 狈究。
超鏈接標(biāo)記的屬性href是不能缺少的碗淌，標(biāo)記對之間加入需要鏈接的文本或者圖像（鏈接圖像時加入 img src=“ ” 標(biāo)記）。
href的值可以是URL形式抖锥，即網(wǎng)址或相對路徑亿眠；也可以說mailto，即發(fā)送E-mail形式磅废。
（1）超鏈接是URL：
語法為：a href=“URL” ····· /a纳像；例如：a href=“http：//www.jxust.cn/” 江西理工大學(xué)主頁 /a 。
（2）超鏈接是電子郵件：
語法為：a href=“mailto：E-mail” ····? /a拯勉；例如：a href=“mailto：100694086@qq.com” 我的QQ郵箱 /a 竟趾。
在HTML文檔中創(chuàng)建錨記的語法格式如下：
a name = “ ” ····? /a
上面的語法標(biāo)記要配合 a href = “ ” ··· /a 來使用才有效果耙考。
上門的語法標(biāo)記是用來在HTML中創(chuàng)建一個錨記（Mark），屬性name必不可少潭兽，它的值就是網(wǎng)頁中的錨記名倦始。
用法：
1）先在需要錨記的地方使用 a name =“ ”····? /a 的語法標(biāo)記，創(chuàng)建出標(biāo)記名山卦。
2）使用 a href =“ #標(biāo)記名” 點擊此處將使瀏覽器跳到“標(biāo)記名”處? /a 鞋邑；就能完成錨記
注意：若使用href賦值的是標(biāo)記名，必須在標(biāo)記名的前面加一個#账蓉！
4枚碗、列表標(biāo)記：
列表是一系列的條目，這些條目通常占一行铸本，而且它們前面往往有一個符號（字母或數(shù)字）——有序列表肮雨。
如果建立列表的時候沒有使用符號，則這樣的列表稱為：無序列表箱玷。
（1）用dl····/dl 怨规、dt···/dt、dd···/dd 定義列表：
dl····/dl 用來創(chuàng)建一個普通的列表锡足。
dt···/dt 用來創(chuàng)建列表中的上層項目波丰。
dd···/dd 用來創(chuàng)建列表中的最下層項目。
dt···/dt 和 dd···/dd 都必須放在 dl····/dl 這個標(biāo)記對之間舶得。
（2）用ul···/ul掰烟、li···/li 創(chuàng)建無序列表：
ul···/ul標(biāo)記對用來創(chuàng)建一個無序列表。
列表的段頭符號為disk（實心圓）沐批、circle（空心圓）纫骑、square（實心方框）三種。
用屬性type指定要顯示的段頭符號九孩，默認(rèn)為實心圓先馆。例如：ul type=“disk”表示創(chuàng)建的是帶有實心圓段頭符號的無序列表。
li···/li標(biāo)記對只能在ul···/ul標(biāo)記對之間使用捻撑，此標(biāo)記用來創(chuàng)建列表的一個列表項磨隘，且創(chuàng)建的是無序列表的表項。
（3）用ol···/ol顾患、li···/li 創(chuàng)建有序列表：
ol···/ol標(biāo)記對用來創(chuàng)建一個有序列表。
列表的段頭符號為數(shù)字个唧、大小寫英文字母江解、大小寫羅馬字母。
用屬性type指定要顯示的段頭符號徙歼，默認(rèn)為數(shù)字犁河。例如：ol type=“a” 表示創(chuàng)建的是小寫英文字母為段頭符號的有序列表鳖枕。
li···/li標(biāo)記對只能在ol···/ol標(biāo)記對之間使用，此標(biāo)記用來創(chuàng)建列表的一個列表項桨螺，且創(chuàng)建的是有序列表的表項宾符。
4. 表格：
表格是網(wǎng)頁中顯示數(shù)據(jù)的一種非常有用的方法；表格標(biāo)記對于制作網(wǎng)頁是很重要的灭翔，當(dāng)前很多網(wǎng)頁都是使用多重表格來布局的魏烫。
1、table····/table 標(biāo)記：
上述標(biāo)記是用來創(chuàng)建一個表格肝箱，它的屬性如下圖：
2哄褒、caption····/caption 標(biāo)記：
上述標(biāo)記對是可選的。如果table··/table標(biāo)記對包含它煌张，它必須是table···/table標(biāo)記對的第一個標(biāo)記呐赡。
caption···/caption標(biāo)記對作用是說明表格的標(biāo)題。
3骏融、th···/th链嘀、tr···/tr、td···/td 標(biāo)記：
th···/th 標(biāo)記對用來設(shè)置表格頭档玻，通常是黑體居中文字管闷。
tr···/tr 標(biāo)記對用來創(chuàng)建表格中的首行。此標(biāo)記對只能放在table···/table標(biāo)記對之間使用窃肠，而且在此標(biāo)記對之間加入文本將是無用的包个，在tr···/tr標(biāo)記對之間只能緊跟td···/td標(biāo)記對才有效。
td···/td 標(biāo)記對用來創(chuàng)建表格一行中的數(shù)據(jù)單元格冤留，此標(biāo)記對也只有放在tr···/tr標(biāo)記對之間才有效碧囊，要顯示的文本也只有放在td···/td標(biāo)記中才有效。
一般情況下纤怒，表格每行中單元格數(shù)目相同糯而，每列中的單元格數(shù)目也相同；要使一個單元格跨多行或多列泊窘，可使用colspan和rowspan屬性熄驼。
4、thead···/thead烘豹、tbody···/tbody瓜贾、tfoot···/tfoot 標(biāo)記：
上述標(biāo)記對將表格進一步分為列標(biāo)題部分、主體部分和頁腳部分携悯。
5祭芦、表格的嵌套：
td 元素可以包含任何其他表示性元素，也可以為另一個表格憔鬼，這就允許利用表格進行頁面的顯示和布局龟劲。
6胃夏、表格內(nèi)的文本處理：
valign屬性——控制單元格內(nèi)文本的垂直對齊。
align屬性——控制單元格內(nèi)文本的水平對齊昌跌。
（1）valign語法：
valign=“【value】”仰禀，其中value可取的值為 top、middle蚕愤、bottom和baseline答恶。
（2）align語法：
align=“【value】”，其中value可取的值為left审胸、right 亥宿、center和justify。
5. 框架：
框架可以用來向瀏覽器窗口中裝載多個HTML文件砂沛；每個HTML文件占據(jù)一個框架烫扼，而多個框架可以同時顯示在同一個瀏覽器窗口中，它們組成了一個最大的框架碍庵。
1映企、frameset···/framset 標(biāo)記：
上述標(biāo)記對放在框架的主文檔的body···/body標(biāo)記對的外邊，也可以嵌套在其他框架文檔中静浴。
此標(biāo)記對用來定義主文檔中的有幾個框架并且各個框架是如何排列的堰氓；此標(biāo)記對主要有rows 和cols兩個屬性。
2苹享、frame···/frame 標(biāo)記：
上述標(biāo)記對放在frameset···/frameset標(biāo)記對之間双絮。
上述標(biāo)記對用來定義一個具體的框架。
frame標(biāo)記具有src和name兩個屬性得问，都必須賦值囤攀。
src是此框架的源HTML文件名（包含相對路或網(wǎng)址），瀏覽器將會在此框架中顯示src指定的HTML文件宫纬。
name是此框架的名字焚挠，這個名字用來供超鏈接標(biāo)記的框架名。
frame標(biāo)記還有scrolling和noresize屬性漓骚；scrolling用來指定是否顯示滾動條蝌衔，取值可以是yes、no或auto蝌蹂；noresize屬性直接加入標(biāo)記中即可使用噩斟，無須賦值，作用為禁止用戶調(diào)整框架的大胁嫘拧亩冬；還有bordercolor、硼身、frameborder硅急、marginheight（指定框架上下邊界與框架內(nèi)容之間空白區(qū)的高度、marginwidth（同上是左右空白區(qū)寬度）等屬性佳遂。
3营袜、noframes···/noframes 標(biāo)記：
上述標(biāo)記對也是放在frameset··/frameset標(biāo)記對之間。
作用是在不支持框架的瀏覽器中顯示文本或圖像信息丑罪。
此標(biāo)記對之間要先緊跟body···/body標(biāo)記對荚板，然后才能使用其他標(biāo)記。
框架實例：
6. 表單：
表單在Web網(wǎng)頁中用來給訪問者填寫信息吩屹，從而能獲得用戶信息跪另，使網(wǎng)頁具有交互功能。
1煤搜、form···/form 標(biāo)記：
用form···/form標(biāo)記定義一個表單免绿，主要是用好form標(biāo)記的屬性，其主要屬性如下：
（1）action屬性：
action屬性用來指定提交表單時接收表單數(shù)據(jù)的URL擦盾，語法為：
form action=“myURL” 同樣也可以更改為郵箱地址嘲驾。
（2）method屬性：
method屬性是要用來定義處理程序從表單中獲得信息的方式，可取值為GET和POST的其中一個迹卢。
GET方式是處理程序從當(dāng)前HTML文檔中獲得數(shù)據(jù)辽故，但是這種方式傳送的數(shù)據(jù)量是有限的。
POST方式與GET方式相反腐碱，它是當(dāng)前的HTML文檔把數(shù)據(jù)傳送給處理程序誊垢，傳輸數(shù)據(jù)量相對較大。
（3）name屬性：
表單的name屬性用于定義表單的名稱症见，JavaScript可以通過此名字訪問它喂走，否則，需要通過數(shù)字訪問它筒饰。
（4）target屬性：
若使用了框架缴啡，target屬性用來告知瀏覽器在哪個框架中打開服務(wù)器產(chǎn)生的應(yīng)答。
2瓷们、input標(biāo)記：
input標(biāo)記用來定義一個用戶輸入?yún)^(qū)业栅，用戶可以在其中輸入信息。
3谬晕、select···/select碘裕、option標(biāo)記：
select···/select標(biāo)記對用來創(chuàng)建一個下拉列表框或可以復(fù)制的列表框。
次標(biāo)記對用在form···/form標(biāo)記對之間攒钳。
select 具有multiple（使列表框可多選）帮孔、name（列表框的名字）和size（列表的高度，默認(rèn)是1）屬性。
option標(biāo)記用來指定列表框中的一個選項文兢，它放在select···/select標(biāo)記對之間晤斩。
option標(biāo)記具有selected（指定默認(rèn)的選項）和value（給option指定的選項賦值）兩個屬性。
4姆坚、textarea····/textarea 標(biāo)記：
上述標(biāo)記對用來創(chuàng)建一個可以輸入多行的文本框澳泵。
此標(biāo)記對用在form····/form標(biāo)記對之間。
它具有name（名字）兼呵、cols（列數(shù)）和rows（行數(shù)）屬性兔辅。
表單實例：
7. 層疊樣式表CSS和DIV標(biāo)記：
1、CSS簡介：
采用CSS技術(shù)击喂，可以有效的對網(wǎng)頁頁面的布局维苔、字體、顏色懂昂、背景和其他效果實現(xiàn)更加精確的控制介时。
三個優(yōu)點：
一組樣式可以調(diào)用在多個對象上。
語法易學(xué)易懂忍法。
豐富的樣式效果潮尝。
（并非所有的瀏覽器都支持CSS樣式，事先要進行測試）
2饿序、CSS與HTML：
CSS與HTML的組織方式大致有4種：
（1）嵌入式：
（2）鏈接式：
適用于網(wǎng)頁的內(nèi)容比較豐富勉失、樣式比較復(fù)雜時。
（3）引入式：
這種方式不常用原探，做法是：在HTML文件的 head····/head標(biāo)記對之間加入說明性的代碼：
@import url（Testcss.css）
3乱凿、DIV標(biāo)記：
DIV標(biāo)記用來為HTML文檔內(nèi)大塊的內(nèi)容提供結(jié)構(gòu)和背景。
DIV的起始標(biāo)記和結(jié)束標(biāo)記之間的所有內(nèi)容構(gòu)成這個塊咽弦。
其格式為：div id=“div-name”style=“屬性1：屬性1值徒蟆；屬性2：屬性2值·······屬性n：屬性n值；”? 塊內(nèi)內(nèi)容? /div 型型。
屬性：
（1）基本屬性：width段审、height、left闹蒜、top寺枉、background-color。
（2）定位屬性：position屬性值可以為absolute——塊的位置固定不動或relative——位置隨內(nèi)容的實際情況進行浮動绷落。
（3）顯示屬性：display屬性值可以為block——顯示或者none——隱藏姥闪。
（4）優(yōu)先屬性：z-index屬性值為一個整數(shù)（正負(fù)均可）∑鏊福可以理解我z軸的坐標(biāo)筐喳。
（5）透明屬性：opacity屬性值為0.3時是瀏覽器Firefox專用；其屬性值為30等價于filter；alpha——IE瀏覽器專用避归。
