資源描述:
《網(wǎng)頁設(shè)計與制作項目教程(項目二-任務(wù)01)》由會員上傳分享,免費在線閱讀,更多相關(guān)內(nèi)容在教育資源-天天文庫。
1、任務(wù)1:制作簡單的圖文頁面項目二創(chuàng)建基本頁面1Dreamweaver軟件基本操作2創(chuàng)建、管理站點3創(chuàng)建圖文頁面學(xué)習(xí)內(nèi)容任務(wù)描述知識目標:通過系統(tǒng)學(xué)習(xí)使學(xué)生能做到基本掌握Dreamweaver軟件的基本用法,掌握創(chuàng)建與管理站點、創(chuàng)建簡單圖文頁面的方法。技能目標:通過講解輔導(dǎo)與作業(yè)練習(xí),要使學(xué)生能熟練掌握Dreamweaver的操作方法,簡單頁面的制作方法,并能靈活應(yīng)用知識技巧。素質(zhì)目標:1.具有勤奮學(xué)習(xí)的態(tài)度,嚴謹求實、創(chuàng)新的工作作風;2.具有良好的心理素質(zhì)和職業(yè)道德素質(zhì);3.具有高度責任心和良好的團隊合作精神;
2、4.具有一定的科學(xué)思維方式和判斷分析問題的能力;5.具有較強的網(wǎng)頁設(shè)計創(chuàng)意思維、藝術(shù)設(shè)計素質(zhì)。任務(wù)1:制作簡單的圖文頁面任務(wù)描述創(chuàng)建站點,文件及文件夾命名及站點文件目錄結(jié)構(gòu)符合規(guī)范。網(wǎng)頁設(shè)置標題圖文混排,與效果圖保持一致。任務(wù)分析該頁面為一個簡單圖文頁面,其中主要內(nèi)容由文字與圖片組成,以水平線分隔。頁面路徑文字圖片水平線網(wǎng)頁標題任務(wù)實施步驟1準備站點文件與素材步驟2創(chuàng)建站點步驟3創(chuàng)建頁面文件標題工作區(qū)“設(shè)計”視圖步驟4更改頁面標題及輸入文字步驟5插入圖片步驟6設(shè)置圖片的對齊方式,并插入其他圖片步驟7插入水平線步
3、驟8保存并在瀏覽器中預(yù)覽效果知識點一.DreamweaverCS5簡介AdobeDreamweaverCS5是一款集網(wǎng)頁制作和管理網(wǎng)站于一身的所見即所得網(wǎng)頁編輯器,DreamweaverCS5是第一套針對專業(yè)網(wǎng)頁設(shè)計師特別發(fā)展的視覺化網(wǎng)頁開發(fā)工具,利用它可以輕而易舉地制作出跨越平臺限制和跨越瀏覽器限制的充滿動感的網(wǎng)頁。二.DreamweaverCS5啟動界面菜單欄工具欄【屬性】面板面板組1.菜單欄【菜單欄】包括多種菜單項,單擊任意一個菜單項將彈出一個下拉菜單,在下拉菜單中選擇不同的菜單項可以完成不同的操作。2.
4、工具欄【文檔】工具欄中包含視圖選擇按鈕,單擊該按鈕使可以在文檔的【代碼】、【拆分】和【設(shè)計】視圖間快速切換。3.屬性面板在【屬性】面板中,主要用于查看和更改所選擇的對象的各種屬性。4.面板組面板組是一組??吭谀硞€標題下面的相關(guān)面板的集合,面板集中了網(wǎng)頁編輯和站點管理過程中集中的按鈕。三.DreamweaverCS5工作界面插入欄設(shè)計選項1.插入欄插入欄中包含【常用】、【布局】、【表單】、【數(shù)據(jù)】、【Spry】、【文本】、【收藏夾】插入欄。(1)在【常用】插入欄中,可以創(chuàng)建和插入最常用的對象,例如圖像和表格。(2
5、)在【布局】插入欄中,包括標準表格和擴展表格兩個選項卡。(3)【表單】:在Dreamweaver中,表單輸入類型稱為表單對象,是動態(tài)網(wǎng)頁中最重要的元素對象之一。(4)在【數(shù)據(jù)】插入欄中,可以插入各種數(shù)據(jù),如Spry數(shù)據(jù)對象、記錄集和插入記錄等。(5)在【Spry】插入欄中,包含構(gòu)建【Spry】頁面等按鈕,其中包括Spry數(shù)據(jù)對象和構(gòu)件等按鈕。(6)文本是網(wǎng)頁中最常見、運用最廣泛的元素之一,是網(wǎng)頁內(nèi)容的核心部分,在網(wǎng)頁中添加文本與在Word等文字處理軟件中添加文本一樣方便。(7)【收藏夾】插入欄中,使用鼠標右鍵單
6、擊,即可自定義收藏夾對象。2.設(shè)計視圖設(shè)計、代碼及拆分三種設(shè)計視圖。四.使用DreamweaverCS5創(chuàng)建站點1.使用【管理站點】向?qū)Т罱ㄕ军c2.使用【高級】面板創(chuàng)建站點五.使用DreamweaverCS5管理站點及站點文件夾1.使用DreamweaverCS5管理站點(1)打開站點(2)編輯站點(3)刪除站點(4)復(fù)制站點2.管理站點中的文件(1)創(chuàng)建文件夾(2)創(chuàng)建網(wǎng)頁文件(3)移動和復(fù)制文件六.在網(wǎng)頁中創(chuàng)建文本1.在網(wǎng)頁中輸入文本2.設(shè)置字體格式七.插入特殊文本對象1.插入特殊字符2.插入水平線3.插入
7、注釋4.插入日期八.項目符號和編號列表1.創(chuàng)建項目列表2.創(chuàng)建編號列表九.插入頁面的頭部內(nèi)容1.設(shè)置META2.插入關(guān)鍵字3.插入說明4.插入刷新5.設(shè)置基礎(chǔ)6.設(shè)置鏈接7.設(shè)置標題十.插入與設(shè)置圖像元素1.在網(wǎng)頁中插入圖像2.設(shè)置圖像屬性3.圖像的對齊方式4.插入圖像占位符5.設(shè)置圖像占位符6.插入鼠標經(jīng)過圖像分析與思考1.為什么要創(chuàng)建站點?2.如何在頁面中輸入空格?3.在插入圖像時,彈出【圖像標簽輔助功能屬性】對話框,在其中設(shè)置的“替換文本”有何作用?4.圖像對齊方式有哪幾種?5.插入圖像占位符有什么作用?
8、6.在【文檔】工具欄中的【標題】中輸入的標題,顯示在何處?任務(wù)小結(jié)1.使用【站點】中【新建站點】或者【管理站點】的命令創(chuàng)建站點,在【站點設(shè)置對象】對話框中設(shè)置【站點名稱】與【本地站點文件夾】。2.使用【文件】菜單或者【本地文件】面板在Dreamweaver軟件中創(chuàng)建文件、編輯文件和保存文件。3.在頁面中輸入文字,使用【插入】菜單中的命令插入水平線和特殊字符。4.在頁面中使用圖片,使用【