第一篇：動態(tài)網(wǎng)頁制作教案

一、教學(xué)目標：

1、知識目標

（1）了解動態(tài)HTML，動態(tài)網(wǎng)頁的概念

（2）能夠?qū)崿F(xiàn)簡單的動態(tài)HTML效果，能夠插入簡單的javascript代碼（3）掌握動態(tài)網(wǎng)頁的特性

2、能力目標

（1）培養(yǎng)學(xué)生的探究學(xué)習(xí)能力（2）進一步提高學(xué)生的審美能力

3、情感目標

（1）培養(yǎng)學(xué)生正確評價、選擇、運用信息的價值觀（2）培養(yǎng)學(xué)生的版權(quán)意識

（3）使學(xué)生正確認識技術(shù)的兩面性。

二、教學(xué)重點與難點 重點：

（1）動態(tài)HTML和動態(tài)網(wǎng)頁的概念（2）插入簡單的動態(tài)HTML特效 難點

插入javascript網(wǎng)頁特效

三、教學(xué)過程

（一）動態(tài)HTML的概念

1、情景創(chuàng)設(shè)

教師：展示做好的網(wǎng)頁，網(wǎng)頁中有許多動態(tài)HTML的效果，問：請觀察以下網(wǎng)頁，注意哪些地方發(fā)生了動態(tài)的變化？

學(xué)生：仔細觀察，發(fā)現(xiàn)有文字移動，背景顏色隨鼠標變化等特效，興趣大增。教師引導(dǎo)：同學(xué)們想不想學(xué)呢，這是什么技術(shù)呢？

2、動態(tài)HTML(DHTML)的 概念

教師給出概念：在脫離網(wǎng)絡(luò)環(huán)境下，網(wǎng)頁下載到瀏覽器以后仍能夠隨時變換的HTML

3、教師演示：

在FrontPage中，提供了一些動態(tài)HTML效果，教師演示操作步驟 例1：實現(xiàn)簡單的動態(tài)HTML效果 演示:鼠標特效

方法：格式----動態(tài)HTML 教師只演示其中一個，其他例子先讓學(xué)生自己探索。培養(yǎng)學(xué)生的自學(xué)能力。學(xué)生探索研究后，老師請先完成的同學(xué)出來演示，并講解難點，如鼠標懸停效果。

4、學(xué)生練習(xí)

教師講解完后，讓學(xué)生繼續(xù)鞏固動態(tài)HTML特效，做練習(xí)一 練習(xí)一：實現(xiàn)簡單的動態(tài)HTML效果（1）、網(wǎng)頁加載效果

（2）、鼠標懸停效果（提供背景圖片）（3）、單擊（4）、雙擊

5、學(xué)生成果交流與評價

問：是不是動態(tài)效果越多越好呢?培養(yǎng)學(xué)生審美觀。

讓學(xué)生相互評價，哪些地方加得恰到好處，哪些地方加得不大合適？

教師總結(jié)：frontpage2000自帶的動態(tài)HTML特效，實質(zhì)上是在原網(wǎng)頁上自動增加了一些代碼，那么，除了frontpage2000自帶的動態(tài)HTML特效，還有更豐富更具個性化的特效嗎？

6、引伸：

為進一步理解動態(tài)HTML，不僅僅是ftontpage自動產(chǎn)生的那些，還有更加豐富更加全面各種特效，教師提供一些簡單的javascript小程序，對動態(tài)HTＭＬ作一些引伸，例2：插入簡單的javascript網(wǎng)頁特效 教師演示：怎樣插入“顯示當(dāng)前日期”的代碼 強調(diào)難點：一定要注意插入代碼的位置。練習(xí)二：請插入以下幾個網(wǎng)頁特效（1）、記數(shù)器（2）、顯示當(dāng)前時間（3）、跟隨鼠標的時鐘（4）、禮花背景

教師事先準備好這幾個小程序，學(xué)生分組練習(xí)，分四組，每個組只要完成其中一個特效。

7、學(xué)生作品交流與評價

教師小結(jié)：這里只是插入的最簡單的代碼，還有一些復(fù)雜的代碼在以后的章節(jié)中有要求進一步學(xué)習(xí)，javascript小程序是實現(xiàn)動態(tài)HTML特效的主要工具。還有css等等 注意：使用別人代碼時，要注意別人的版權(quán)信息。同學(xué)們還想更多特效，教師提供以下網(wǎng)址，課外資源 七色風(fēng)網(wǎng)頁特效 網(wǎng)頁特效觀止 網(wǎng)頁特效

你知道亂用javascript特效的后果嗎？有些人專門編制了這種小程序，對網(wǎng)頁產(chǎn)生了一些破壞作用，這是非常不道德的。

同學(xué)們對于動態(tài)HTML非常感興趣，特鼓勵同學(xué)好好專研，成為javascript的編程高手。

過渡：進一步理解動態(tài)網(wǎng)頁的概念。動態(tài)網(wǎng)頁不僅局限于動態(tài)HTML 還包括采用CGI、ASP、JSP、PHP、Perl等技術(shù)動態(tài)生成的頁面

（二）、動態(tài)網(wǎng)頁的概念

這里所謂的動態(tài)主要強調(diào)的是人機關(guān)系，即，按照訪問者的不同需要對訪問者輸入的信息作不同的響應(yīng)，并提供相應(yīng)的信息。

教師展示網(wǎng)站，讓學(xué)生體驗良好的人機關(guān)系，這些網(wǎng)站主要是由asp、php等技術(shù)生成的 例3：認識幾種動態(tài)網(wǎng)站 http://004km.cn/platform/index.php?t=book_index_first http://004km.cn/default_login.asp數(shù)據(jù)檢索，后臺數(shù)據(jù)庫 http://blog.163.com/jswzb博客系統(tǒng)

通過演示，讓學(xué)生體會到本節(jié)所說的動態(tài)網(wǎng)頁這個“動”字的涵義，主要強調(diào)的是一種人機交流，而不是一種動畫技術(shù)。

（三）、總結(jié)：靜態(tài)網(wǎng)頁和動態(tài)網(wǎng)頁的比較 請學(xué)生討論完成以下表格： 靜態(tài)網(wǎng)頁 動態(tài)網(wǎng)頁

是否支持動態(tài)顯示效果 無法實現(xiàn)動態(tài)顯示效果 能實現(xiàn)個性化的交互功能，能否及時更新和響應(yīng) 維護繁瑣，不便人機交互,信息反饋 更少的刷新、更快的響應(yīng)并減輕了服務(wù)器負擔(dān)，維護簡單，交互功能強，交流方便

是否能支持數(shù)據(jù)庫 無法支持數(shù)據(jù)庫 支持數(shù)據(jù)庫，查詢修改數(shù)據(jù)方便

第二篇：動態(tài)網(wǎng)頁制作心得

煙臺大學(xué)文經(jīng)學(xué)院

姓名：

班級：

學(xué)號： 網(wǎng) 頁 制 作 課 程 心 得題目：xxxxxx xx xxxxx xxxxxxxxxx

我制作的動態(tài)網(wǎng)頁的主題是宣傳我的家鄉(xiāng)，通過網(wǎng)頁將家鄉(xiāng)的特色表現(xiàn)出來。通過網(wǎng)頁可以讓關(guān)注本網(wǎng)頁的人更多的了解棗莊。還對一些熱愛旅游的驢友來棗莊時可以更快的融入我們棗莊這個大家庭。

我制作的網(wǎng)頁內(nèi)容豐富。其一，包括棗莊的新聞，最新的新

聞可以使人通過現(xiàn)有發(fā)生的事來了解棗莊，新聞來源是棗莊最大的新聞網(wǎng)“齊魯在線”，新聞?wù)鎸嵱行АＦ涠?，有豐富的圖片，圖片可以說明問題，可以更好的反映棗莊的美景特色。圖片來自棗莊旅游局官網(wǎng)。其三，有動聽的音樂，收錄了中國動聽的音樂，有反映棗莊鐵道游擊隊時的歌曲。其三，有中國各代在中國出現(xiàn)的名人。例如：墨子，奚仲，匡衡，孟嘗君，蘭陵笑笑生等名人的個人介紹。其四，有好的視頻。是棗莊旅游宣傳片，精彩不容錯過。其五，有專屬于棗莊的貼吧，點擊鏈接到百度棗莊貼吧。其六，有文庫，里面介紹棗莊來歷，發(fā)展，棗莊人的精神。其七，包含棗莊的地圖，地圖上標注了棗莊的有名的旅游景點，例如，臺兒莊大戰(zhàn)紀念館、萬畝榴園、熊耳山、微山湖的景點。

動態(tài)網(wǎng)頁設(shè)計這門課程是一門綜合性很強而且非常實用的課程。包括.html、CSS、js、ajax、面向?qū)ο蟮鹊?。這門課程讓我了解到ASP.NET是一個統(tǒng)一的Web開發(fā)模型，能使用盡可能少的代碼生成企業(yè)級ASP.NET網(wǎng)站所必需的各種服務(wù)。讓我明白了如何去創(chuàng)建一個網(wǎng)站。…表示文檔頭部信息。…表示瀏覽器標題欄中的信息，應(yīng)包含于

…中。表示CSS樣式信息，應(yīng)包含于…中。…表示文檔主題部分。

…

在制作動態(tài)網(wǎng)頁中我學(xué)到了很多東西，懂得網(wǎng)頁制作的許多

技巧，很容易就能制作一個簡單的網(wǎng)頁。以下我羅列出我學(xué)習(xí)到的技巧。

一、我知道如何利用超鏈接，現(xiàn)在可以靈活的利用它，明白超鏈接的原理。比如我可以鏈接到一個郵件、網(wǎng)站、視頻等等。在網(wǎng)頁中插入并經(jīng)圖片使網(wǎng)頁更加美觀。

二、明白了如何向空間中插入背景音樂，使網(wǎng)頁變的有激情。簡單了解了制作網(wǎng)頁中的代碼，并且可以寫一些基礎(chǔ)的代碼來使網(wǎng)頁得到想要的效果。

三、網(wǎng)頁中我還插入了一些視頻，并且可以讓瀏覽人很快的應(yīng)用下載視頻。

四、可以向網(wǎng)站中插入滾動圖片，滾動字幕，插入時間，插入圖層等。

再現(xiàn)在這個年代，計算機的作用越來越重要了，人民生活辦

公都離不開它，然而像這門如此深奧的知識，一般人是接觸不到的。選擇了這門課我感覺很高興，接觸到一些計算機知識，了解動態(tài)網(wǎng)頁制作的基礎(chǔ)。由于老師上課的耐心教導(dǎo)，我的認真聽講，使我制作出這個讓我滿意的作品，我很高興很開心。說實話，對

于這門選修課我還想再上，可以讓我更深的了解計算機知識，明白計算機的深奧。可惜沒時間了，只能等以后自學(xué)了。

我以前總認為編程是一件很痛苦的事情，但是經(jīng)過這次作

業(yè)，使我明白了編程也可以是一件很有趣的事情。想象一下：自己去構(gòu)思和設(shè)計一個別人都沒做過的項目那是多么的有成就感。學(xué)習(xí)網(wǎng)頁設(shè)計不能心急，這不是一日之功，要想有比較高的造詣，沒有長期的練習(xí)是達不到的。

我想我已經(jīng)敲開了動態(tài)網(wǎng)頁設(shè)計這扇大門，大門里有很多精

彩的風(fēng)景需要我去瀏覽。當(dāng)然也會有很多荊棘坎坷需要我去面對。相信只要有恒心，我終會摘到勝利的果實！

第三篇：動態(tài)網(wǎng)頁制作心得

煙臺大學(xué)文經(jīng)學(xué)院

姓名：班級：學(xué)號：

網(wǎng) 頁 制 作 課 程 心 得

題目：xxxxxx

xx xxxxx xxxxxxxxxx 我制作的動態(tài)網(wǎng)頁的主題是宣傳我的家鄉(xiāng)，通過網(wǎng)頁將家鄉(xiāng)的特色表現(xiàn)出來。通過網(wǎng)頁可以讓關(guān)注本網(wǎng)頁的人更多的了解棗莊。還對一些熱愛旅游的驢友來棗莊時可以更快的融入我們棗莊這個大家庭。

我制作的網(wǎng)頁內(nèi)容豐富。其一，包括棗莊的新聞，最新的新聞可以使人通過現(xiàn)有發(fā)生的事來了解棗莊，新聞來源是棗莊最大的新聞網(wǎng)“齊魯在線”，新聞?wù)鎸嵱行?。其二，有豐富的圖片，圖片可以說明問題，可以更好的反映棗莊的美景特色。圖片來自棗莊旅游局官網(wǎng)。其三，有動聽的音樂，收錄了中國動聽的音樂，有反映棗莊鐵道游擊隊時的歌曲。其三，有中國各代在中國出現(xiàn)的名人。例如：墨子，奚仲，匡衡，孟嘗君，蘭陵笑笑生等名人的個人介紹。其四，有好的視頻。是棗莊旅游宣傳片，精彩不容錯過。其五，有專屬于棗莊的貼吧，點擊鏈接到百度棗莊貼吧。其六，有文庫，里面介紹棗莊來歷，發(fā)展，棗莊人的精神。其七，包含棗莊的地圖，地圖上標注了棗莊的有名的旅游景點，例如，臺兒莊大戰(zhàn)紀念館、萬畝榴園、熊耳山、微山湖的景點。

動態(tài)網(wǎng)頁設(shè)計這門課程是一門綜合性很強而且非常實用的課程。包括.html、CSS、js、ajax、面向?qū)ο蟮鹊?。這門課程讓我了解到ASP.NET是一個統(tǒng)一的Web開發(fā)模型，能使用盡可能少的代碼生成企業(yè)級ASP.NET網(wǎng)站所必需的各種服務(wù)。讓我明白了如何去創(chuàng)建一個網(wǎng)站。…表示文檔頭部信息。…表示瀏覽器標題欄中的信息，應(yīng)包含于…中。表示CSS樣式信息，應(yīng)包含于…中。…

第四篇：動態(tài)網(wǎng)頁制作與感想

在Internet飛速發(fā)展的今天，互聯(lián)網(wǎng)成為人們快速獲取、發(fā)布和傳遞信息的重要渠道，它在人們政治、經(jīng)濟、生活等各個方面發(fā)揮著重要的作用。因此網(wǎng)站建設(shè)在Internet應(yīng)用上的地位顯而易見，它已成為**、企事業(yè)單位信息化建設(shè)中的重要組成部分，從而倍受人們的重視。使用計算機的能力也成為當(dāng)代大學(xué)生學(xué)習(xí)、生活、工作的基本要求。計算機入門不難。我們希望把計算機當(dāng)成工具，而不是自己當(dāng)程序員。我們只想用計算機提高設(shè)計速度和準確性，提高工作效率，減輕手工勞動的負擔(dān)，這才是我們使用計算機想要達到的目的和追求的目標。

通過這兩個月在學(xué)習(xí)實踐中的學(xué)習(xí)和老師的指導(dǎo)，在制作時想想使自己的網(wǎng)頁更加豐富多彩，在網(wǎng)頁中插入圖象，動畫，動態(tài)特效?？墒强傆龅竭@樣那樣的問題，例如Flash動畫到入Dreamweaver里，開始不明白后來才知道是在Dreamweaver里先插個層，這樣就可以瀏覽出效果了。還有是有時上傳到網(wǎng)頁上的圖片不顯示，原因是它們沒有在一個文件夾內(nèi)。但在同學(xué)的幫助和自己摸索的情況下完成了這個實習(xí)的成果。看到了一些知名的網(wǎng)站開發(fā)出的網(wǎng)頁，不僅欄目內(nèi)容豐富，信息量大，而且頁面圖文并茂，五彩繽紛，使得網(wǎng)民贊嘆不已，流連忘返。以我們的經(jīng)驗，當(dāng)前的軟件的功能日趨復(fù)雜，不學(xué)到一定的深度和廣度是難以在實際工作中應(yīng)付自如的。因此反映出學(xué)習(xí)的還不夠，缺點疏漏。虛在加以刻苦鉆研及學(xué)習(xí)，不斷開拓視野，增強自己的實踐操作技能，為以后能做出出色的網(wǎng)頁而努力。常言道：“性急吃不了熱豆腐”。建立一個網(wǎng)站就像蓋一幢大樓一樣，它是一個系統(tǒng)工程，有自己特定的工作流程，你只有遵循這個步驟，按部就班地一步步來，才能設(shè)計出一個滿意的網(wǎng)站。學(xué)習(xí)時首先要找準自己的位置。要把計算機看成一種工具、一種技能，而不要被書本上那些難懂的知識以及抽象的理論概念嚇倒。其次要把自己感興趣的地方當(dāng)成著眼點、突破口。其三，貴在動手這一點非常重要。最后，選擇適合自己的輔助教材，堅決摒棄那些現(xiàn)在用不著的內(nèi)容。網(wǎng)站設(shè)計八步驟

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

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

二、搜集材料

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

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

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

四、選擇合適的制作工具

盡管選擇什么樣的工具并不會影響你設(shè)計網(wǎng)頁的好壞，但是一款功能強大、使用簡單的軟件往往可以起到事半功倍的效果。網(wǎng)頁制作涉及的工具比較多，首先就是網(wǎng)頁制作工具了，目前大多數(shù)網(wǎng)民選用的都是所見即所得的編輯工具，這其中的優(yōu)秀者當(dāng)然是Dreamweaver和

Frontpage了，如果是初學(xué)者，F(xiàn)rontpage2000是首選。除此之外，還有圖片編輯工具，如Photoshop、Photoimpact等；動畫制作工具，如Flash、Cool 3d、Gif Animator等；還有網(wǎng)頁特效工具，如有聲有色等，網(wǎng)上有許多這方面的軟件，你可以根據(jù)需要靈活運用。制作網(wǎng)頁用的軟件是Dreamweaver,Fireworks,Flash軟件。Dreamweaver大大加速了網(wǎng)絡(luò)時代電子交易應(yīng)用中的項目交付。它提供了網(wǎng)頁和表單的動態(tài)生成到企業(yè)級的解決方案，如電子商店，庫存管理系統(tǒng)和企業(yè)內(nèi)部局域網(wǎng)的數(shù)據(jù)庫應(yīng)用等功能。Fireworks是目前最流行的網(wǎng)頁圖象制作軟件。只要將Dreamweaver的默認圖象編輯器設(shè)為Fireworks，那么在Fireworks中制作完成網(wǎng)頁圖象后將其輸出就會立即在Dreamweaver中更新。Fireworks還可以安裝使用所有的Photoshop濾鏡，并且可以直接導(dǎo)入PSD格式圖象。更方便的是它不僅結(jié)合了Photoshop位圖功能以及CoreIDRAW矢量圖的功能，而且提供了大量的網(wǎng)頁圖象模板供用戶使用，例如，網(wǎng)頁上很流行的陰影和立體按紐等效果，只需單擊一下就可以制作完成。當(dāng)然，其最方便之處是，它可以將圖象切割，圖象映射，懸停按紐，圖象翻轉(zhuǎn)等效果直接生成HTML代碼，或者嵌入到現(xiàn)有的網(wǎng)頁中，或者作為單了的網(wǎng)頁出現(xiàn)。Flash是目前最流行的矢量動畫制作軟件，與其他Wed動畫軟件相比，它具很多優(yōu)點。制作的是矢量圖形。只要用少量矢量數(shù)據(jù)就可以描述一個復(fù)雜的對象，而占用的儲存空間只是位圖的幾千分之一，非常適合在網(wǎng)格上使用。同時，矢量圖象不會隨瀏覽器窗口大小的改變而改變畫面質(zhì)量。使用插件方式工作。用戶只需安裝一次插件，以后就可以快速啟動并觀看動畫，而不比像Java那樣每次都要啟動虛擬機。Flash插件也不大，只有170KB左右，很容易下載并安裝。還提供其他一些增強功能。例如，支持位圖，聲音，漸變色和Alpha透明等。擁用了這些功能，用戶就完全可以建立一個全部由Flash制作的站點。Flash影片也是一種流式文件。這就是說，瀏覽者在觀看一個大動畫時，可以不必等到影片全部下載到本地再觀看，而是可以隨時觀看，即使后面的內(nèi)容還沒有完全下載，也可以開始欣賞動畫。主圖是一個網(wǎng)頁的門面，它能體現(xiàn)出這個網(wǎng)頁的整體風(fēng)格。

五、制作網(wǎng)頁

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

六、上傳測試

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

七、推廣宣傳

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

八、維護更新

網(wǎng)站要注意經(jīng)常維護更新內(nèi)容，保持內(nèi)容的新鮮，不要一做好就放在那兒不變了，只有不斷地給它補充新的內(nèi)容，才能夠吸引住瀏覽者

第五篇：網(wǎng)頁制作教案

網(wǎng)頁制作與設(shè)計教案

第一講 網(wǎng)頁設(shè)計概述....................................................................................................................3 1.1WWW和URL.....................................................................................................................3 1.2IE5的使用............................................................................................................................3 1.3 網(wǎng)頁中所使用的技術(shù)............................................................................................................4 1.4 制作網(wǎng)頁的基本方法............................................................................................................4 第二講 HTML的基本標志與格式標志.......................................................................................4 2.1 HTML文檔的基本結(jié)構(gòu).........................................................................................................5 第三講 HTML的文本、圖片與超級鏈接標志...........................................................................5 2.2 插入文字................................................................................................................................6 2.3 插入圖片................................................................................................................................8 2.4 建立超級鏈接........................................................................................................................8 第四講 HTML表格、表單與框架標志.......................................................................................9 2.5 插入表格................................................................................................................................9 2.6 表單的應(yīng)用..........................................................................................................................10 2.7 框架窗口..............................................................................................................................10 第五講 HTML標志綜合運用案例.............................................................................................11 第六講 DREAMWEAVER中簡單WEB站點建立與管理.....................................................12 3.1 DREAMWEAVER概述............................................................................................................12 第七講 DREAMWEAVER中靜態(tài)網(wǎng)頁設(shè)計.............................................................................13 3.2 在頁面中加入文字和圖像..................................................................................................14 3.3 超級鏈接的運用..................................................................................................................14 3.4.表格的應(yīng)用.........................................................................................................................14 3.5.在網(wǎng)頁中創(chuàng)建表單.............................................................................................................15 第八講 DREAMWEAVER中動態(tài)網(wǎng)頁設(shè)計.............................................................................15 第九講 DREAMWEAVER綜合性網(wǎng)頁設(shè)計案例.....................................................................16 第十講 VBSCRIPT概述.............................................................................................................17 4.1 VBSCRIPT語言簡介.............................................................................................................17 第十一講 VBSCRIPT的基本元素與輸入輸出.........................................................................18 4.2.基本數(shù)據(jù)類型.......................................................................................................................18 4.2.表達式和運算符.................................................................................................................19 第十二講 VBSCRIPT的條件語句、循環(huán)語句和過程.............................................................20 4.3 VBSCRIPT基本語句.............................................................................................................20

第一講 網(wǎng)頁設(shè)計概述

【教學(xué)內(nèi)容】

講解網(wǎng)頁設(shè)計的相關(guān)術(shù)語及網(wǎng)站制作的基本流程?！窘虒W(xué)目的】

使學(xué)生對網(wǎng)站及網(wǎng)頁有一定的認識，激發(fā)學(xué)生學(xué)習(xí)網(wǎng)頁設(shè)計的興趣?！窘虒W(xué)重點】

網(wǎng)頁設(shè)計中的若干術(shù)語。【教學(xué)難點】

理解網(wǎng)頁設(shè)計中的若干術(shù)語。【教學(xué)方式】

講授式、討論式、案例分析式?！窘虒W(xué)參考】

1、《網(wǎng)頁設(shè)計與制作》楊尚森 曲宏山 賈文峰等著 電子工業(yè)出版社。

2、《Internet 網(wǎng)頁工場》Wittime工作室 重慶出版社。

3、《WEB網(wǎng)站設(shè)計》Joel Sklar著 高等教育出版社。

4、《HTML網(wǎng)頁制作教程》材義語編著 鐵道出版社。【新課內(nèi)容】

1.1 WWW和URL 1.1.1 Web的起源

Web是World Wide Web的簡稱，一般也稱之為WWW或3W 1.1.2 Web的特點和結(jié)構(gòu)

Web最大的特點是使用了超文本（Hypertext）WWW采用C/S（客戶機/服務(wù)器）工作模式

在瀏覽器和服務(wù)器之間應(yīng)用HTTP（Hyper Text Transfer Protocol，超文本傳輸協(xié)議）作為網(wǎng)絡(luò)應(yīng)用層通信協(xié)議 1.1.3 URL URL的完整格式

協(xié)議://主機名或IP地址：端口號/路徑名/文件名

1.2 IE5的使用

Web瀏覽器是瀏覽Internet資源的客戶端軟件

在Windows環(huán)境下使用的瀏覽器主要有Internet Explorer、Netscape Navigator、Mosaic等

1.2.1 IE5的界面 1.2.2 IE5的使用

列表標志的使用?！窘虒W(xué)方式】

討論式、案例分析式、練習(xí)式?！窘虒W(xué)參考】

1、《網(wǎng)頁設(shè)計與制作》楊尚森 曲宏山 賈文峰等著 電子工業(yè)出版社。

2、《WEB網(wǎng)站設(shè)計》Joel Sklar著 高等教育出版社。

3、《HTML網(wǎng)頁制作教程》材義語編著 鐵道出版社。【新課內(nèi)容】

2.1 HTML文檔的基本結(jié)構(gòu)

2.1.1 HTML語法

1、雙標記

語法：

<標記>內(nèi)容

2、單標記 語法：<標記> 最常用的單標記是

3、標記屬性 語法

<標記

屬性1 屬性2 屬性3 … > 例子

4、注釋語句 格式

例子

2.1.2 HTML文檔的基本結(jié)構(gòu) 【課后小結(jié)】

通過本次課的學(xué)習(xí),要求能熟練掌握網(wǎng)頁面的基本標志與格式標志,并能靈活運用 列表,有序列表,無序列表標志及屬性。

第三講 HTML的文本、圖片與超級鏈接標志

【教學(xué)內(nèi)容】

講解HTML標準中的文本、圖片與超級鏈接標志 【教學(xué)目的】

* 使學(xué)生了解標題元素,掌握字體,上下標,及特殊字符的標志。

< EM>......，強調(diào)文字，通常用斜體。

< STRONG>......，特別強調(diào)的文字，通常用黑體。

......，以等寬體顯示西文字符。

......，使文字大小相對于前面的文字增大一級。

......，使文字大小相對于前面的文字減小一級。^......，使文字成為前一個字符的上標。_......，使文字成為前一個字符的下標。......，使文字顯示為閃爍效果。2.2.6

文本修飾 2.2.7

預(yù)格式化文本 使用預(yù)格式化標記

不再忽略在此之間的空格、制表符與回車符等元素 2.2.8 轉(zhuǎn)義字符與特殊字符

一般轉(zhuǎn)義符都是以“&”開始，以“；”結(jié)束，一個轉(zhuǎn)義符之間不能有空格 2.2.9 文本強制換行和不換行 文本強制換行

不換行 2.2.10 插入水平線 使用