第5章Dreamweaver網(wǎng)設(shè)計(jì)軟件

第5章Dreamweaver網(wǎng)頁(yè)設(shè)計(jì)軟件主要內(nèi)容：Dreamweaver軟件介紹Dreamweaver軟件配置Dreamweaver軟件設(shè)計(jì)網(wǎng)頁(yè)程序文件過(guò)程第一頁(yè)，共二十四頁(yè)。5.1DreamweaverMX2004概述特點(diǎn)：交互式插入網(wǎng)頁(yè)元素（文本框、按鈕等）。自動(dòng)產(chǎn)生標(biāo)記。在線提示標(biāo)記選項(xiàng)，和選項(xiàng)內(nèi)容。第二頁(yè)，共二十四頁(yè)。5.1DreamweaverMX2004概述5.1.1DreamweaverMX2004簡(jiǎn)介創(chuàng)建網(wǎng)站站點(diǎn)（創(chuàng)建一個(gè)文件夾）用于保存網(wǎng)頁(yè)文件。網(wǎng)頁(yè)系統(tǒng)調(diào)試完畢上傳到指定網(wǎng)站。第三頁(yè)，共二十四頁(yè)。5.1DreamweaverMX2004概述5.1.2DreamweaverMX2004操作界面設(shè)計(jì)者：采用“所見(jiàn)即所得”的方式維護(hù)網(wǎng)頁(yè)。代碼編寫(xiě)者：通過(guò)輸入HTML語(yǔ)句代碼編寫(xiě)網(wǎng)頁(yè)文件。第四頁(yè)，共二十四頁(yè)。5.1DreamweaverMX2004概述5.1.2DreamweaverMX2004操作界面運(yùn)行Dreamweaver打開(kāi)的第一個(gè)窗口。第五頁(yè)，共二十四頁(yè)。5.1DreamweaverMX2004概述5.1.2DreamweaverMX2004操作界面Dreamweaver工作窗口第六頁(yè)，共二十四頁(yè)。5.2建立和編輯網(wǎng)頁(yè)程序網(wǎng)頁(yè)文件：可以在瀏覽器上顯示的頁(yè)面文件。主頁(yè)文件：訪問(wèn)網(wǎng)站時(shí)打開(kāi)的第一個(gè)網(wǎng)頁(yè)文件。默認(rèn)的主頁(yè)文件名：index.htm、index.html、default.htm、default.html第七頁(yè)，共二十四頁(yè)。5.2建立和編輯網(wǎng)頁(yè)程序第八頁(yè)，共二十四頁(yè)。5.2建立和編輯網(wǎng)頁(yè)程序5.2.1建立空白網(wǎng)頁(yè)文件第九頁(yè)，共二十四頁(yè)。5.2建立和編輯網(wǎng)頁(yè)程序Dreamweaver網(wǎng)頁(yè)文件編輯窗口。第十頁(yè)，共二十四頁(yè)。5.2建立和編輯網(wǎng)頁(yè)程序Dreamweaver網(wǎng)頁(yè)文件編輯窗口。代碼卡：手工編輯html標(biāo)記設(shè)計(jì)卡：交互方式編輯html標(biāo)記拆分卡：拆分成兩個(gè)窗口，上邊窗口編輯標(biāo)記，下邊窗口顯示網(wǎng)頁(yè)效果。第十一頁(yè)，共二十四頁(yè)。5.2建立和編輯網(wǎng)頁(yè)程序5.2.2設(shè)置網(wǎng)頁(yè)頁(yè)面的屬性打開(kāi)或新建網(wǎng)頁(yè)文件。單擊網(wǎng)頁(yè)窗口下邊的“展開(kāi)”“收縮”按鈕。單擊“網(wǎng)頁(yè)屬性”可以設(shè)置的“外觀”屬性有：字體、字號(hào)、字色、背景色、背景圖片。“鏈接”屬性有：連接字體、字號(hào)、鏈接顏色、已訪問(wèn)鏈接色、活動(dòng)鏈接色、鏈接下劃線樣式?！皹?biāo)題”屬性有：標(biāo)題字體、標(biāo)題n字號(hào)、標(biāo)題n字色。第十二頁(yè)，共二十四頁(yè)。5.2建立和編輯網(wǎng)頁(yè)程序5.2.3插入和設(shè)置網(wǎng)頁(yè)頁(yè)面的文本1）插入文本打開(kāi)網(wǎng)頁(yè)。單擊“設(shè)計(jì)”卡。輸入文字。按“enter”另起一段。按“shift+enter”換一行（行間距?。?）插入特殊符號(hào)打開(kāi)網(wǎng)頁(yè)。定位光標(biāo)。單擊“插入”|“HTML”|“特殊字符”|“其它字符”3）插入日期打開(kāi)網(wǎng)頁(yè)。定位光標(biāo)。單擊“插入”|“日期”第十三頁(yè)，共二十四頁(yè)。5.2建立和編輯網(wǎng)頁(yè)程序5.2.4插入和設(shè)置網(wǎng)頁(yè)頁(yè)面的導(dǎo)航條1）插入導(dǎo)航條grapmenu.htm打開(kāi)網(wǎng)頁(yè)。單擊“設(shè)計(jì)”卡。定位導(dǎo)航條位置。單擊“插入”|“圖像對(duì)象”|“導(dǎo)航條”設(shè)置導(dǎo)航條元件、項(xiàng)目名稱(chēng)、狀態(tài)圖像、前往的URL。2）圖片鏈接tupimenu.htm在網(wǎng)頁(yè)中插入圖片和鏈接<ahref="a.htm"><imgsrc="companys.jpg"></a>第十四頁(yè)，共二十四頁(yè)。5.2建立和編輯網(wǎng)頁(yè)程序5.2.5插入和設(shè)置網(wǎng)頁(yè)頁(yè)面的修飾線1）插入修飾線打開(kāi)網(wǎng)頁(yè)。單擊“設(shè)計(jì)”卡。定位修飾線位置。單擊“插入”|“HTML”|“水平線”設(shè)置水平線的寬度、高度、對(duì)齊方式。第十五頁(yè)，共二十四頁(yè)。5.3表格的應(yīng)用5.3.1插入表格tablesp.htm打開(kāi)網(wǎng)頁(yè)。單擊“設(shè)計(jì)”卡。定位表格位置。單擊“插入”|“表格”定義表格的行數(shù)、列數(shù)、表格寬度、邊框粗細(xì)、頁(yè)眉、標(biāo)題、對(duì)齊方式。5.3.2設(shè)置表格合并單元格、設(shè)置某一個(gè)單元格屬性（背景色）5.3.3表格作用對(duì)網(wǎng)頁(yè)內(nèi)容進(jìn)行布局，表格邊框線粗細(xì)為0第十六頁(yè)，共二十四頁(yè)。5.4超鏈接的應(yīng)用5.4.1設(shè)置網(wǎng)頁(yè)超級(jí)鏈接setlink.htm打開(kāi)網(wǎng)頁(yè)。單擊“設(shè)計(jì)”卡。定位光標(biāo)位置。單擊“插入”|“超級(jí)鏈接”輸入提示文本，輸入鏈接網(wǎng)址，網(wǎng)頁(yè)鏈接使用URL。5.4.2設(shè)置郵件超級(jí)鏈接打開(kāi)網(wǎng)頁(yè)。單擊“設(shè)計(jì)”卡。定位光標(biāo)位置。單擊“插入”|“電子郵件鏈接”輸入提示文本，輸入鏈接的郵箱地址。第十七頁(yè)，共二十四頁(yè)。5.5表單的應(yīng)用5.5.1表單formsamp.htm打開(kāi)網(wǎng)頁(yè)。單擊“設(shè)計(jì)”卡。定位光標(biāo)位置。單擊“插入”|“表單”（form）<form

name=“form1”method=“post”action=““></form>在表單里可以插入多個(gè)元素（文本框、單選按鈕…）第十八頁(yè)，共二十四頁(yè)。5.5表單的應(yīng)用5.5.2文本框formsamp.htm打開(kāi)網(wǎng)頁(yè)。單擊“設(shè)計(jì)”卡。在表單里定位光標(biāo)位置。輸入文字內(nèi)容單擊“插入”|“表單”|”文本字段”<form

name=“form1”method=“post”action=““><input

name="textfield"type="text"size="18"maxlength="18"></form>在表單里可以插入多個(gè)元素（文本框、單選按鈕…）第十九頁(yè)，共二十四頁(yè)。5.5表單的應(yīng)用5.5.6”提交“”重置“按鈕formsamp.htm打開(kāi)網(wǎng)頁(yè)。單擊“設(shè)計(jì)”卡。在表單里定位光標(biāo)位置。單擊“插入”|“表單”|”按鈕”<form

name=“form1”method=“post”action=“formsamp.php“><input

name="textfield"type="text"size="18"maxlength="18">

<input

type="submit"name="Submit"value="提交"></form>插入“提交”按鈕后應(yīng)該指定服務(wù)器后臺(tái)處理程序action選項(xiàng)formsamp.php添加重置按鈕時(shí)type=“reset”第二十頁(yè)，共二十四頁(yè)。5.5表單的應(yīng)用5.5.3單選按鈕formsamp.htm打開(kāi)網(wǎng)頁(yè)。單擊“設(shè)計(jì)”卡。在表單里定位光標(biāo)位置。單擊“插入”|“表單”|”單選按鈕”<form

name=“form1”method=“post”action=“formsamp.php“>男<inputtype="radio"name="radiobutton"value="radiobutton">女<inputtype="radio"name="radiobutton"value="radiobutton">

<input

type="submit"name="Submit"value="提交"></form>插入“提交”按鈕后應(yīng)該指定服務(wù)器后臺(tái)處理程序action選項(xiàng)formsamp.php添加重置按鈕時(shí)type=“reset”第二十一頁(yè)，共二十四頁(yè)。5.5表單的應(yīng)用5.5.4復(fù)選框formsamp.htm打開(kāi)網(wǎng)頁(yè)。單擊“設(shè)計(jì)”卡。在表單里定位光標(biāo)位置。單擊“插入”|“表單”|”復(fù)選框”<form

name=“form1”method=“post”action=“formsamp.php“>計(jì)算機(jī)<inputtype="checkbox"name="checkbox"value="checkbox">英語(yǔ)<inputtype="checkbox"name="checkbox2"value="checkbox">

<input

type="submit"name="Submit"value="提交"></form>插入“提交”按鈕后應(yīng)該指定服務(wù)器后臺(tái)處理程序action選項(xiàng)formsamp.php添加重置按鈕時(shí)type=“reset”第二十二頁(yè)，共二十四頁(yè)。5.5表單的應(yīng)用5.5.5列表菜單formsamp.htm打開(kāi)網(wǎng)頁(yè)。單擊“設(shè)計(jì)”卡。在表單里定位光標(biāo)位置。單擊“插入”|“表單”|”列表菜單”<form

name=“form1”method=“post”action=“formsamp.php“><selectname=“select”size=“1”>(size>”1”是列表，size=“1”是菜單)<optionvalue="addrec">添加記錄</option><optionvalue="modrec">修改記錄</option><optionvalue="delrec">刪除記錄</option><optionvalue="srcrec">查詢記錄</option></select><input

type="submit"name="Submit"value="提交"></form>插入“提交”按鈕后應(yīng)該指定服務(wù)器后臺(tái)處理程序action選項(xiàng)formsamp.php添加重置按鈕時(shí)type=“reset”第二十三頁(yè)，共二十四頁(yè)。內(nèi)容總結(jié)第5章Dreamweaver網(wǎng)頁(yè)設(shè)計(jì)軟件。5.1DreamweaverMX2004概述。5.1DreamweaverMX2004概述。在線提示標(biāo)記選項(xiàng)，和選項(xiàng)內(nèi)容。5.1.