第9章 使用Dreamweaver電子課件

第9章

使用Dreamweaver知識(shí)要點(diǎn)（1）熟悉Dreamweaver的基本界面元素：菜單、工具欄、文檔窗口、狀態(tài)欄、工作面板等（2）掌握使用Dreamweaver創(chuàng)建和管理本地站點(diǎn)（3）掌握在Dreamweaver中插入文本、圖像、表格、表單等各種網(wǎng)頁(yè)元素，并進(jìn)行各種屬性設(shè)置（4）掌握在Dreamweaver中使用CSS樣式（5）掌握Dreamweaver的快速代碼編寫(xiě)功能（6）掌握使用媒體查詢(xún)實(shí)現(xiàn)響應(yīng)式網(wǎng)頁(yè)設(shè)計(jì)本章目標(biāo)（1）基本功能（1）基本功能1．創(chuàng)建本地站點(diǎn)（1）基本功能2．站點(diǎn)文件操作（1）基本功能3．DW網(wǎng)頁(yè)制作的一般過(guò)程01創(chuàng)建/建立本地站點(diǎn)02創(chuàng)建網(wǎng)頁(yè)文件03設(shè)置網(wǎng)頁(yè)屬性05保存網(wǎng)頁(yè)，預(yù)覽網(wǎng)頁(yè)效果04插入網(wǎng)頁(yè)元素，設(shè)置元素屬性（1）基本功能4．文本與超鏈接（1）基本功能5．圖像與多媒體（1）基本功能6．使用表格（1）基本功能7．使用表單（1）基本功能8．創(chuàng)建CSS樣式表（1）基本功能9．定義樣式規(guī)則（2）高級(jí)應(yīng)用1．快速代碼編寫(xiě)——emmet輸入nav>ul>li（子元素）ul>li*2（重復(fù)元素）div+p+b（兄弟元素）div+div>p>span+em^bq（上移一層）ul>li.item$*3（項(xiàng)目編號(hào)）div>(header>ul>li*2>a)+footer>p（括號(hào)分組）#header.title（2）高級(jí)應(yīng)用2．快速代碼編寫(xiě)——多光標(biāo)操作AltCtrl（2）高級(jí)應(yīng)用3．快速代碼編寫(xiě)——代碼片斷（2）高級(jí)應(yīng)用4．響應(yīng)式設(shè)計(jì)所謂響應(yīng)式設(shè)計(jì)，就是所設(shè)計(jì)的網(wǎng)站或應(yīng)用，能夠根據(jù)用戶(hù)行為和設(shè)備環(huán)境（系統(tǒng)平臺(tái)、屏幕尺寸、屏幕定向等）進(jìn)行相應(yīng)的響應(yīng)和調(diào)整。不論用戶(hù)使用的是大屏幕顯示，還是平板電腦，或者是手機(jī)，系統(tǒng)都應(yīng)能自動(dòng)切換分辨率、圖片尺寸以及相關(guān)腳本功能。隨著移動(dòng)設(shè)備的廣泛使用，響應(yīng)式設(shè)計(jì)已經(jīng)是網(wǎng)頁(yè)設(shè)計(jì)的基本要求。（2）高級(jí)應(yīng)用（2）高級(jí)應(yīng)用5．使用媒體查詢(xún)@mediamediatypeand(mediafeature){CSS-Code;}其中mediatype可以是all（所有媒體，默認(rèn)值）、print（打?。?、screen（屏幕）和speech（屏幕閱讀器）等，如果沒(méi)有特殊要求，一般不寫(xiě)或者寫(xiě)screen；mediafeature是媒體屬性，取值包括：width、min-width、max-width、height、min-height、max-height、resolution、orientat