Dreamweaver CS3網(wǎng)頁設(shè)計(jì)培訓(xùn)教程電子教案01_第1頁
Dreamweaver CS3網(wǎng)頁設(shè)計(jì)培訓(xùn)教程電子教案01_第2頁
Dreamweaver CS3網(wǎng)頁設(shè)計(jì)培訓(xùn)教程電子教案01_第3頁
Dreamweaver CS3網(wǎng)頁設(shè)計(jì)培訓(xùn)教程電子教案01_第4頁
Dreamweaver CS3網(wǎng)頁設(shè)計(jì)培訓(xùn)教程電子教案01_第5頁
已閱讀5頁,還剩26頁未讀, 繼續(xù)免費(fèi)閱讀

下載本文檔

版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)

文檔簡介

第1課網(wǎng)頁制造根底本課要點(diǎn)詳細(xì)要求本課導(dǎo)讀上機(jī)練習(xí)本課要點(diǎn)網(wǎng)頁制造的相關(guān)知識(shí)初識(shí)DreamweaverCS3詳細(xì)要求了解網(wǎng)頁的定義及組成元素了解網(wǎng)頁常見部分的稱謂及規(guī)范了解網(wǎng)頁制造的流程了解網(wǎng)頁配色技巧了解DreamweaverCS3的任務(wù)界面掌握DreamweaverCS3的根本設(shè)置掌握DreamweaverCS3的根本操作本課導(dǎo)讀 網(wǎng)頁是構(gòu)成網(wǎng)絡(luò)的主體,是互聯(lián)網(wǎng)信息的主要載體。在學(xué)習(xí)網(wǎng)頁制造前,需求了解網(wǎng)頁制造的相關(guān)知識(shí),以便在以后的學(xué)習(xí)及任務(wù)中運(yùn)用。另外,我們還需求認(rèn)識(shí)網(wǎng)頁制造工具DreamweaverCS3的任務(wù)界面、根本設(shè)置以及一些簡單的運(yùn)用,如啟動(dòng)與退出DreamweaverCS3、新建、保管、預(yù)覽及翻開網(wǎng)頁文檔等。1.1網(wǎng)頁制造的相關(guān)知識(shí) 網(wǎng)上沖浪已成為生活的一個(gè)重要組成部分,人們經(jīng)過網(wǎng)絡(luò)來獲取知識(shí)、資源,越來越多的企事業(yè)單位也將網(wǎng)頁作為宣傳公司品牌籠統(tǒng)的一種重要手段,網(wǎng)頁也從以前的純文本方式逐漸開展到圖、文、聲音及動(dòng)畫兼有的綜合方式。下面我們就來學(xué)習(xí)網(wǎng)頁制造的各種知識(shí)。1.1網(wǎng)頁制造的相關(guān)知識(shí) 1.1.1知識(shí)講解 1.1.2典型案例——用“記事本〞制造“welcome.html〞網(wǎng)頁1.1.1知識(shí)講解 在開場學(xué)習(xí)網(wǎng)頁制造之前,應(yīng)先了解一下什么是網(wǎng)頁以及一些相關(guān)的專業(yè)術(shù)語。1.1.1知識(shí)講解 1.網(wǎng)頁的定義及組成元素 2.網(wǎng)頁常見部分的稱謂及規(guī)范3.網(wǎng)頁制造的流程 4.網(wǎng)頁配色技巧1.網(wǎng)頁的定義及組成元素 閱讀網(wǎng)頁時(shí)在閱讀器中看到的一個(gè)個(gè)頁面就是網(wǎng)頁,其中包括多種多樣的網(wǎng)頁元素,如文本、圖像、動(dòng)畫和音樂等。 文本是網(wǎng)頁最根本的組成元素,是網(wǎng)頁的主體部分。 圖像也是網(wǎng)頁中不可短少的元素,是使網(wǎng)頁看起來更美觀的點(diǎn)睛之筆。動(dòng)畫在網(wǎng)頁中也有廣泛的運(yùn)用,網(wǎng)頁中常用的動(dòng)畫格式主要有兩種:一種是SWF動(dòng)畫,一種是GIF動(dòng)畫。播放音樂是為閱讀者提供聽覺感受的最正確選擇,但由于受音樂版權(quán)的約束,在專業(yè)網(wǎng)站中很少有運(yùn)用背景音樂的,只在部分個(gè)人主頁或企業(yè)網(wǎng)站中有所運(yùn)用。2.網(wǎng)頁常見部分的稱謂及規(guī)范 通常情況下,網(wǎng)頁的根本組成部分有Logo、Banner、導(dǎo)航條、超鏈接和版權(quán)信息等。3.網(wǎng)頁制造的流程 制造網(wǎng)頁不像編輯文檔那樣輕松,需求遵照一定的流程:搜集資料和素材、規(guī)劃站點(diǎn)、制造網(wǎng)頁、測試站點(diǎn)、發(fā)布站點(diǎn)、更新和維護(hù)站點(diǎn)等。 1〕搜集資料和素材 2〕規(guī)劃站點(diǎn) 3〕制造網(wǎng)頁 4〕測試站點(diǎn) 5〕發(fā)布站點(diǎn) 6〕更新和維護(hù)站點(diǎn)4.網(wǎng)頁配色技巧 網(wǎng)頁中的顏色通常用十六進(jìn)制數(shù)來表示,如“#FF0000〞表示紅色,“#00FF00〞表示綠色、“#0000FF〞表示藍(lán)色、“#FFFF00〞表示黃色、“#FFFFFF〞表示白色、“#000000〞表示黑色等,即每兩位為一種顏色,從左到右分別為紅、綠、藍(lán)三色,每組顏色的取值均為00~FF〔十進(jìn)制數(shù)255的十六進(jìn)制值〕。1.1.2典型案例——用“記事本〞制造“welcome.html〞網(wǎng)頁案例目的 本案例將運(yùn)用“記事本〞制造一個(gè)簡單的網(wǎng)頁。1.1.2典型案例——用“記事本〞制造“welcome.html〞網(wǎng)頁操作思緒〔1〕利用以HTML代碼創(chuàng)建的文本文件可以經(jīng)過“記事本〞等文本編輯程序直接進(jìn)展編寫的特點(diǎn)制造本網(wǎng)頁文檔?!?〕創(chuàng)建圖像和文本等內(nèi)容。〔3〕從構(gòu)造上講,HTML文件由兩大部分組成:一是頭部〔即<head>標(biāo)簽與</head>標(biāo)簽之間的內(nèi)容,如網(wǎng)頁的標(biāo)題就放置在頭部〕,二是主體〔即<body>標(biāo)簽與</body>標(biāo)簽之間的內(nèi)容,也就是在閱讀器中看到的內(nèi)容〕。為了與普通的文本文件相區(qū)別,將<html>標(biāo)簽與</html>標(biāo)簽分別放置在網(wǎng)頁代碼最前及最后,這樣,一個(gè)簡單的網(wǎng)頁就創(chuàng)建好了。1.1.2典型案例——用“記事本〞制造“welcome.html〞網(wǎng)頁操作步驟 詳細(xì)操作步驟請(qǐng)教師參照軟件及書中內(nèi)容進(jìn)展講解。1.1.2典型案例——用“記事本〞制造“welcome.html〞網(wǎng)頁案例小結(jié) 本案例用“記事本〞制造了一個(gè)簡單的網(wǎng)頁文檔。在制造過程中需留意的是:在保管文檔時(shí)一定要在【保管類型】下拉列表框中選擇【一切文件】選項(xiàng);在輸入網(wǎng)頁文檔稱號(hào)時(shí),一定要將網(wǎng)頁文檔的擴(kuò)展名.htm〔或.html〕一并輸入,否那么“記事本〞程序會(huì)將其保管為純文本格式文檔。1.2初識(shí)DreamweaverCS3 在學(xué)習(xí)了網(wǎng)頁制造的根底知識(shí)后,接下來就應(yīng)該認(rèn)識(shí)網(wǎng)頁制造利器——DreamweaverCS3了。1.2初識(shí)DreamweaverCS3 1.2.1知識(shí)講解1.2.2典型案例——用DreamweaverCS3創(chuàng)建“welcome2.html〞網(wǎng)頁1.2.1知識(shí)講解 在學(xué)習(xí)DreamweaverCS3之前應(yīng)先安裝DreamweaverCS3,安裝方法與其他運(yùn)用程序的安裝根本一樣,這里不再贅述。1.2.1知識(shí)講解1.DreamweaverCS3的任務(wù)界面2.DreamweaverCS3的根本設(shè)置1.DreamweaverCS3的任務(wù)界面

2.DreamweaverCS3的根本設(shè)置 在運(yùn)用DreamweaverCS3前,需求進(jìn)展一些簡單的設(shè)置,以方便運(yùn)用軟件。選擇【編輯】→【首選參數(shù)】命令,翻開【首選參數(shù)】對(duì)話框,如圖1.17所示。該對(duì)話框左側(cè)為【分類】列表框,右側(cè)為對(duì)應(yīng)的設(shè)置選項(xiàng);默許翻開的是【常規(guī)】分類,可單擊左側(cè)【分類】列表框中的選項(xiàng)進(jìn)展切換,然后進(jìn)展該分類的設(shè)置。1.2.2典型案例——用DreamweaverCS3創(chuàng)建“welcome2.html〞網(wǎng)頁案例目的 本案例將用DreamweaverCS3制造“welcome2.html〞網(wǎng)頁,其效果和用“記事本〞創(chuàng)建的“welcome.html〞網(wǎng)頁一樣1.2.2典型案例——用DreamweaverCS3創(chuàng)建“welcome2.html〞網(wǎng)頁操作思緒〔1〕創(chuàng)建一個(gè)新網(wǎng)頁并將其保管?!?〕在網(wǎng)頁中添加素材并設(shè)置效果?!?〕參與版權(quán)欄。1.2.2典型案例——用DreamweaverCS3創(chuàng)建“welcome2.html〞網(wǎng)頁操作步驟 詳細(xì)操作步驟請(qǐng)教師參照軟件及書中內(nèi)容進(jìn)展講解。1.2.2典型案例——用DreamweaverCS3創(chuàng)建“welcome2.html〞網(wǎng)頁案例小結(jié) 本案例用DreamweaverCS3創(chuàng)建了一個(gè)網(wǎng)頁,并在IE閱讀器中進(jìn)展了預(yù)覽。經(jīng)過本案例的學(xué)習(xí),可以看出Dreamweaver的強(qiáng)大功能及由此帶來的便利。Dreamweaver最大的特點(diǎn)之一就是可視化的操作,使得用戶在不是很了解網(wǎng)頁的框架言語HTML時(shí)即可隨心所欲地對(duì)網(wǎng)頁元素進(jìn)展添加、刪除以及各種屬性設(shè)置,大大地減輕了初學(xué)者的負(fù)擔(dān),使初學(xué)者可以輕松上手,為以后的學(xué)習(xí)打下根底。1.3上機(jī)練習(xí) 1.3.1用“記事本〞創(chuàng)建“Goodmorning.html〞網(wǎng)頁1.3.2用DreamweaverCS3制造“Goodmorning2.html〞網(wǎng)頁1.3.1用“記事本〞創(chuàng)建“Goodmorning.html〞網(wǎng)頁 本練習(xí)將運(yùn)用“記事本〞制造“Goodmorning.html〞網(wǎng)頁文檔。1.3.1用“記事本〞創(chuàng)建“Goodmorning.html〞網(wǎng)頁操作思緒:將素材文件夾中的一切圖像復(fù)制到網(wǎng)頁要保管的文件夾中,如“D:\web〞。翻開“記事本〞程序,新建一個(gè)文件,將其保管到與素材圖像一樣的文件夾中,如“D:\web〞,并將其稱號(hào)設(shè)置為“Goodmorning.html〞。參照效果圖輸入一切的代碼,然后進(jìn)展保管。1.3.2用DreamweaverCS3制造“Goodmorning2.html〞網(wǎng)頁

溫馨提示

  • 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會(huì)有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網(wǎng)僅提供信息存儲(chǔ)空間,僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對(duì)用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請(qǐng)與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。

評(píng)論

0/150

提交評(píng)論