網(wǎng)頁設(shè)計與制作項目教程(項目二-任務(wù)01)ppt課件

1、義務(wù)1：制造簡單的圖文頁面工程二 創(chuàng)建根本頁面1 Dreamweaver軟件根本操作2 創(chuàng)建、管理站點3 創(chuàng)建圖文頁面學(xué)習(xí)內(nèi)容義務(wù)描畫知識目的： 經(jīng)過系統(tǒng)學(xué)習(xí)使學(xué)生能做到根本掌握Dreamweaver 軟件的根本用法，掌握創(chuàng)建與管理站點、創(chuàng)建簡單圖文頁面的方法。技藝目的： 經(jīng)過講解輔導(dǎo)與作業(yè)練習(xí)，要使學(xué)生能熟練掌握Dreamweaver的操作方法，簡單頁面的制造方法，并能靈敏運用知識技巧。素質(zhì)目的：1. 具有勤勞學(xué)習(xí)的態(tài)度，嚴謹務(wù)虛、創(chuàng)新的任務(wù)作風(fēng)；2. 具有良好的心思素質(zhì)和職業(yè)品德素質(zhì)；3. 具有高度責(zé)任心和良好的團隊協(xié)作精神；4. 具有一定的科學(xué)思想方式和判別分析問題的才干；5. 具有較強

2、的網(wǎng)頁設(shè)計創(chuàng)意思想、藝術(shù)設(shè)計素質(zhì)。義務(wù)1：制造簡單的圖文頁面義務(wù)描畫創(chuàng)建站點，文件及文件夾命名及站點文件目錄構(gòu)造符合規(guī)范。網(wǎng)頁設(shè)置標(biāo)題圖文混排，與效果圖堅持一致。義務(wù)分析該頁面為一個簡單圖文頁面，其中主要內(nèi)容由文字與圖片組成，以程度線分隔。頁面途徑文字圖片程度線網(wǎng)頁標(biāo)題義務(wù)虛施步驟1 預(yù)備站點文件與素材步驟2 創(chuàng)建站點步驟3 創(chuàng)建頁面文件標(biāo)題任務(wù)區(qū)“設(shè)計視圖步驟4 更改頁面標(biāo)題及輸入文字步驟5 插入圖片步驟6 設(shè)置圖片的對齊方式，并插入其他圖片步驟7 插入程度線步驟8 保管并在閱讀器中預(yù)覽效果知識點一Dreamweaver CS5 簡介Adobe Dreamweaver CS5是一款集網(wǎng)頁制造

3、和管理網(wǎng)站于一身的所見即所得網(wǎng)頁編輯器，Dreamweaver CS5是第一套針對專業(yè)網(wǎng)頁設(shè)計師特別開展的視覺化網(wǎng)頁開發(fā)工具，利用它可以輕而易舉地制造出跨越平臺限制和跨越閱讀器限制的充溢動感的網(wǎng)頁。 二Dreamweaver CS5 啟動界面菜單欄工具欄【屬性】面板面板組1. 菜單欄【菜單欄】包括多種菜單項，單擊恣意一個菜單項將彈出一個下拉菜單，在下拉菜單中選擇不同的菜單項可以完成不同的操作。2. 工具欄【文檔】工具欄中包含視圖選擇按鈕，單擊該按鈕使可以在文檔的【代碼】、【拆分】和【設(shè)計】視圖間快速切換。3. 屬性面板在【屬性】面板中，主要用于查看和更改所選擇的對象的各種屬性。4. 面板組面板

4、組是一組?？吭谀硞€標(biāo)題下面的相關(guān)面板的集合，面板集中了網(wǎng)頁編輯和站點管理過程中集中的按鈕。三Dreamweaver CS5 任務(wù)界面插入欄設(shè)計選項1. 插入欄插入欄中包含【常用】、【規(guī)劃】、【表單】、【數(shù)據(jù)】、【Spry】、【文本】、【收藏夾】插入欄。1在【常用】插入欄中，可以創(chuàng)建和插入最常用的對象，例如圖像和表格。2在【規(guī)劃】插入欄中，包括規(guī)范表格和擴展表格兩個選項卡。3【表單】：在Dreamweaver中，表單輸入類型稱為表單對象，是動態(tài)網(wǎng)頁中最重要的元素對象之一。4在【數(shù)據(jù)】插入欄中，可以插入各種數(shù)據(jù)，如Spry數(shù)據(jù)對象、記錄集和插入記錄等。5在【Spry】插入欄中，包含構(gòu)建【Spry】

5、頁面等按鈕，其中包括Spry數(shù)據(jù)對象和構(gòu)件等按鈕。6文本是網(wǎng)頁中最常見、運用最廣泛的元素之一，是網(wǎng)頁內(nèi)容的中心部分，在網(wǎng)頁中添加文本與在Word等文字處置軟件中添加文本一樣方便。7【收藏夾】插入欄中，運用鼠標(biāo)右鍵單擊，即可自定義收藏夾對象。2. 設(shè)計視圖設(shè)計、代碼及拆分三種設(shè)計視圖。四運用Dreamweaver CS5 創(chuàng)建站點1. 運用【管理站點】導(dǎo)游搭建站點2. 運用【高級】面板創(chuàng)建站點五. 運用Dreamweaver CS5管理站點及站點文件夾1. 運用Dreamweaver CS5管理站點1翻開站點2編輯站點3刪除站點4復(fù)制站點2. 管理站點中的文件1創(chuàng)建文件夾2創(chuàng)建網(wǎng)頁文件3挪動和復(fù)

6、制文件六在網(wǎng)頁中創(chuàng)建文本1. 在網(wǎng)頁中輸入文本2. 設(shè)置字體格式七插入特殊文本對象1. 插入特殊字符2. 插入程度線3. 插入注釋4. 插入日期八工程符號和編號列表1. 創(chuàng)建工程列表2. 創(chuàng)建編號列表九插入頁面的頭部內(nèi)容1. 設(shè)置META2. 插入關(guān)鍵字3. 插入闡明4. 插入刷新5. 設(shè)置根底6. 設(shè)置鏈接7. 設(shè)置標(biāo)題十插入與設(shè)置圖像元素1. 在網(wǎng)頁中插入圖像2. 設(shè)置圖像屬性3. 圖像的對齊方式4. 插入圖像占位符5. 設(shè)置圖像占位符6. 插入鼠標(biāo)經(jīng)過圖像分析與思索1.為什么要創(chuàng)建站點？2.如何在頁面中輸入空格？3.在插入圖像時，彈出【圖像標(biāo)簽輔助功能屬性】對話框，在其中設(shè)置的“交換文本

7、有何作用？4.圖像對齊方式有哪幾種？5.插入圖像占位符有什么作用？6.在【文檔】工具欄中的【標(biāo)題】中輸入的標(biāo)題，顯示在何處？義務(wù)小結(jié)1. 運用【站點】中【新建站點】或者【管理站點】的命令創(chuàng)建站點，在【站點設(shè)置對象】對話框中設(shè)置【站點稱號】與【本地站點文件夾】。2. 運用【文件】菜單或者【本地文件】面板在Dreamweaver軟件中創(chuàng)建文件、編輯文件和保管文件。3. 在頁面中輸入文字，運用【插入】菜單中的命令插入程度線和特殊字符。4. 在頁面中運用圖片，運用【插入】菜單中的【圖像】命令插入圖片，選擇圖片后，運用圖像【屬性】面板設(shè)置圖片的格式。5. 在【文件】菜單項選擇擇【在閱讀器中預(yù)覽】命令或者【文檔】工具欄中選擇【在閱讀器中預(yù)覽】按鈕，