3.1網(wǎng)頁的基本操作1、創(chuàng)建文件“起始頁”窗口的【新建】|【HTML】命令選擇菜單【文件】|【新建】命令2、保存文件選擇菜單【文件】|【保存】命令選擇菜單【文件】|【另存為】命令。3、打開和關(guān)閉文件選擇菜單中【文件】|【打開】命令，在“打開”對話框中選擇想要修改的文件即可。關(guān)閉文件可以單擊標題欄的“關(guān)閉”按鈕，也可以選擇菜單中的【文件】|【退出】命令。4、網(wǎng)頁頁面屬性的設(shè)置 網(wǎng)頁頁面屬性是指網(wǎng)頁外觀（如文本的大小、顏色、格式等）、頁面內(nèi)鏈接效果、各級標題的字體樣式等。（1）設(shè)置文檔標題可在“文檔”工具欄的”標題”文本框中輸入文檔標題

（2）設(shè)置頁面屬性 打開頁面屬性對話框的方法：選擇菜單【修改】|【頁面屬性】命令。單擊“屬性”面板中的“頁面屬性”按鈕頁面屬性窗口“外觀”：設(shè)置頁面的一些基本屬性。我們可以定義頁面中的默認文本字體、文本字號、文本顏色、背景顏色和背景圖片等“鏈接”：是一些與頁面的鏈接效果有關(guān)的設(shè)置。“標題”：用來設(shè)置標題字體的一些屬性。“標題/編碼”：“標題”用來修改新建文檔的標題，顯示在瀏覽器標題處和編輯軟件的標題處。編碼可修改頁面編碼信息，。“跟蹤圖像”：文本框用來設(shè)置在頁面編輯過程中使用的描圖圖像的地址和名稱。

3.2文本的插入和編輯3.2.1插入文本3.2.2設(shè)置文本格式3.2.1插入文本

1、輸入文本 輸入時如果按回車鍵換行會便會另起一個段落，在段落與段落之間會產(chǎn)生一個空行。如果希望文本換行后不產(chǎn)生空行可以按Shift+Enter組合鍵或選擇菜單【插入】|【HTML】|【特殊字符】|【換行符】命令換行，2、復(fù)制和粘貼

選擇“編輯”菜單中的“首選參數(shù)”選項，可在“復(fù)制/粘貼”分類設(shè)置粘貼的方式。3、導(dǎo)入文檔選擇【文件】|【導(dǎo)入】命令。3.2.2設(shè)置文本格式

設(shè)置文本格式可以通過“屬性”面板來完成，如圖3-9所示。1、文字屬性的設(shè)置（1）設(shè)置文字字體：選擇菜單中【文本】|【字體】選項中的相應(yīng)字體選項；或者在“屬性”面板上“字體”下拉列表中選擇相應(yīng)的選項。Dreamweaver默認字體較少，如果字體列表中沒有需要的字體，可以在“編輯字體列表”對話框中添加需要的字體到字體列表中。（2）設(shè)置文字字號 選定要改變字號的文本，選擇“屬性”面板上“大小”的下拉列表中選擇相應(yīng)的選項。 注意：如果單位設(shè)置為“點數(shù)(pt)”，設(shè)置為點數(shù)的文字的大小不會隨著分辨率的改變而發(fā)生變化，像素則正好相反。

（3）設(shè)置文字顏色： 選擇“文本”菜單中“顏色”命令，在隨后出現(xiàn)的對話框中選擇所需要的顏色。（4）設(shè)置文本樣式： 選擇“文本”菜單中的“樣式”選項設(shè)置更多類型的字體樣式。2、設(shè)置段落對齊方式 對齊段落有三種方式：左對齊、居中和右對齊可以使用“文本”菜單中“對齊”子菜單進行設(shè)置3、使用列表有序列表又稱為編號列表，所有項目前使用有序的數(shù)字符號進行排列。無序列表又稱為項目列表，所有項目前使用相同的項目符號進行排列。（1）創(chuàng)建列表：選擇“文本”→“列表”選項（2）修改列表屬性選擇【文本】|【列表】|【屬性】命令4、插入水平線選擇菜單【插入】|【HTML】|【水平線】命令，3.3圖像的插入和編輯3.3.1網(wǎng)頁中常見的圖像格式3.3.2插入圖像3.3.3設(shè)置圖片的屬性3.3.4編輯圖像3.3.1網(wǎng)頁中常見的圖像格式1、GIF格式

GIF是一種索引顏色的圖像格式。GIF格式的特點是壓縮比高，磁盤空間占用較少，可以同時存儲若干幅靜止圖象進而形成連續(xù)的動畫。適用于導(dǎo)航條、按鈕、圖標、透明圖像和動畫。2、JPEG格式

JPEG是支持32位顏色圖像，可以保持原圖像的真實顏色。JPEG適合網(wǎng)頁中對圖片質(zhì)量要求較高，有顏色漸變、需要精確色彩顯示的圖片，如照片。3、PNG格式

PNG是一種新興的網(wǎng)絡(luò)圖像格式，是目前保證最不失真的格式，它汲取了GIF和JPG二者的優(yōu)點；PNG還支持透明圖像的制作。PNG的缺點是不支持動畫應(yīng)用效果3.3.2插入圖像1、插入圖片插入圖片的方法:

（1）打開需要加入圖片的網(wǎng)頁后將光標放置在文檔窗口需要插入圖像的位置，然后鼠標單擊常用“插入”工具欄的“圖像”按鈕。如下圖插入圖像按鈕（2）鼠標拖動：在“文件”面板的文件夾中找到需要插入的圖片后，用鼠標拖曳該圖標到網(wǎng)頁文檔窗口中。（3）選擇菜單【插入】|【圖像】命令。2、圖文混排設(shè)置圖片的對齊方式：選中圖片，在“屬性”面板中“對齊”下拉列表框選擇圖片的對齊方式。說明：如果需要文字環(huán)繞圖像可選擇對齊方式中的“左對齊”或“右對齊”。

3、插入圖像占位符方法如下：選擇菜單【插入】|【圖像對象】|【圖像占位符】單擊“插入”工具欄中“圖像”按鈕選擇“圖像占位符”。4、設(shè)置圖片為網(wǎng)頁背景選擇菜單【修改】|【頁面屬性】命令，在“屬性”面板中單擊“頁面屬性”按鈕說明：背景圖片大小是固定的，如果網(wǎng)頁內(nèi)容較多，可以在“重復(fù)”下拉列表中選擇是否要重復(fù)。

3.3.3設(shè)置圖片的屬性

如果需要精確調(diào)整圖像的大小、位置、圖像與網(wǎng)頁邊距的距離等屬性，可以使用圖像“屬性”面板來完成如下圖所示。

1、圖像標記名稱 文本框中輸入的名字可以在腳本語言中被引用。2、精確調(diào)整圖像大小 “寬”和“高”文本框中的數(shù)值是以像素為單位指定圖像的寬度和高度。如將單位設(shè)置為百分比，則圖像的大小會跟隨文檔窗口的大小自動調(diào)整。3、設(shè)置圖片邊距“水平邊距”和“垂直邊距”文本框用來設(shè)置圖像左右和上下與其它頁面元素的距離。通常用于圖文混排等多種元素的頁面。4、源文件“源文件”指定圖像的源文件路徑。5、鏈接“鏈接”指定圖像的超級鏈接。添加鏈接的方法如下：（1）將“指向文件”圖標拖到“站點”面板中的某個文件上，即可建立鏈接。（2）單擊瀏覽文件圖標選擇要鏈接的文件，（3）手動輸入鏈接地址URL。6、替換“替換”指定只顯示文本的瀏覽器或已設(shè)置為手動下載圖像的瀏覽器中代替圖像顯示的替代文本。在某些瀏覽器中，當鼠標指針滑過圖像時也會顯示該文本。7、對齊“對齊”指該圖片對齊同一行上的圖像和文本。主要用于圖文混排或者多個圖像排版使用。8、圖片邊框

“邊框”文本框是用來設(shè)置圖像邊框的寬度，類似給圖片描邊。3.3.4編輯圖像

1、圖像重新取樣添加或減少已調(diào)整大小的JPEG和GIF圖像文件中的像素。對圖像進行重新取樣會減小圖像文件的大小。2、裁剪通過減小圖像區(qū)域編輯圖像。3、亮度/對比度修改圖像中像素的亮度或?qū)Ρ榷取?、銳化

可通過增加圖像中邊緣的對比度來調(diào)整圖像的焦點。注意：圖像編輯功能僅適用于JPEG和GIF圖像文件格式。3.4表格的插入和編輯3.4.1表格的基本操作3.4.2嵌套表格3.4.3表格的導(dǎo)入導(dǎo)出和排序3.4.1表格的基本操作

1、插入表格單擊“插入”工具欄中的插入表格按鈕則選擇菜單【插入】|【表格】命令2、選擇表格（1）選擇整個表格要選定整個表格可以把鼠標放在表格邊框的任意處，當鼠標變?yōu)闀r單擊即可選中整個表格在表格內(nèi)任意處單擊，然后在狀態(tài)欄選中<table>標簽即可。在表格內(nèi)任意處單擊，點鼠標右鍵在彈出菜單中選擇【表格】|【選擇表格】命令或則選擇菜單【修改】|【表格】|【選擇表格】命令。單擊表格左上角（2）選擇單個單元格按住Ctrl鍵，鼠標在需要選中的單元格單擊即可。單擊要選擇的單元格，再選則狀態(tài)欄中的<td>標簽。在要選擇的單元格內(nèi)雙擊鼠標。（3）選擇連續(xù)的單元格按住鼠標左鍵從一個單元格的左上方開始向要連續(xù)選擇單元格的方向拖動。按住Shift建單擊要選擇的單元格。(4)選擇不連續(xù)單元格可以按住Ctrl鍵，單擊要選擇的所有單元格即可。(5)選擇行或列將光標移動到行左側(cè)或列上方，鼠標指針變?yōu)橄蛴一蛳蛳碌募^圖標時，單擊即可。注意：當選中表格或表格中有插入點時，Dreamweaver會顯示表格和列的寬度以及訪問表格標題菜單和列標題菜單的箭頭3、調(diào)整表格的大小（1）調(diào)整表格的大小選取整個表格后，將鼠標放在表格邊框周圍的黑色小方塊上，鼠標變?yōu)殡p箭頭后按住鼠標左鍵拖動即可改變表格大小。當調(diào)整整個表格的大小時，表格中的所有單元格按比例更改大小。（2）調(diào)整行高和列寬把鼠標放在需要調(diào)整列的邊框處，按住鼠標左鍵拖動即可改變行或者是列的大小。若要更改某個列的寬度并保持其他列的大小不變，可按住Shift鍵，然后拖動列的邊框。行的調(diào)整方法同列的相似。4、插入行或列（1）插入單行或單列選擇菜單【插入】|【表格對象】選擇【修改】|【表格】|【插入行】或【修改】|【表格】|【插入列】命令。右鍵單擊要插入行或列的任一單元格，然后選擇【表格】|【插入行】或【表格】|【插入列】命令。單擊列標題菜單，然后選擇“左側(cè)插入列”或“右側(cè)插入列”。（2）插入多行或多列單擊一個單元格，選擇【修改】|【表格】|【插入行或列】命令將出現(xiàn)“插入行或列”對話框。在該對話框中選擇“行”或“列”，然后設(shè)置需要插入的行或列的數(shù)目即可。5．刪除行或列選擇行或列，“編輯”|“清除”命令或按Delete鍵。6．拆分和合并單元格（1）拆分單元格。右擊單元格，快捷菜單中選擇“表格”|“拆分單元格”命令（2）合并單元格。選中多個單元格，選擇“修改”|“表格”|“合并單元格”命令7．設(shè)置表格屬性選中表格，“屬性”面板修改表格的相關(guān)屬性參數(shù)如圖所示8．設(shè)置單元格屬性把光標移動到某個單元格內(nèi)，利用單元格“屬性”面板對單元格的屬性進行設(shè)置3.4.2嵌套表格創(chuàng)建嵌套表格的操作方法（1）插入總表格（2）將光標置于要插入嵌套表格的地方，繼續(xù)插入表格即可。3.4.3表格的導(dǎo)入、導(dǎo)出和排序1．導(dǎo)入表格數(shù)據(jù)選擇“文件”|“導(dǎo)入”|“Excel文檔”命令2．導(dǎo)出表格選擇要導(dǎo)出的表格，再選擇“文件”|“導(dǎo)出”|“表格”命令3．表格排序選中要排序的表格，再選擇“命令”|“排序表格”命令3.5多媒體的使用和編輯

3.5.1Flash動畫的插入和編輯3.5.2音頻的插入和編輯3.5.3視頻的插入和編輯·3.5.1Flash動畫的插入和編輯

1．插入Flash動畫（1）選擇“插入”|“媒體”|Flash命令。（2）在“插入”工具欄的“常用”類別中選擇“媒體”，單擊“插入Flash”圖標。2．設(shè)置Flash動畫的屬性選擇Flash文件，在“屬性”面板中設(shè)置它的屬性3．設(shè)置Flash動畫背景透明設(shè)置透明效果的方法為：（1）選中Flash動畫（2）單擊“屬性”面板中的“參數(shù)”按鈕（3）“參數(shù)”對話框中單擊“加號”按鈕，在參數(shù)文本框中輸入?yún)?shù)為wmode，值為transparent。4．插入Flash按鈕方法：選擇“插入”|“媒體”|“Flash按鈕”命令說明：如果需要修改Flash按鈕對象，可以先選中它，然后在屬性面板中單擊“編輯”按鈕，在“插入Flash按鈕”對話框中更改它的設(shè)置即可。3.5.2音頻的插入和編輯

1、插入背景音樂設(shè)置背景音樂有兩種方法：一種是通過HTML代碼實現(xiàn)，還有一種是通過行為實現(xiàn)。具體步驟如下：（1）打開需要添加背景音樂的文檔，將視圖切換為“拆分”視圖。（2）將光標定位到</body>之前的位置，在光標的位置寫下代碼：<bgsoundsrc="media/RingMyBells.mp3">如下圖所示2．嵌入音頻（1）插入音頻文件方法： 選擇“插入”|“媒體”|“插件”命令說明：插入的音頻文件在文檔窗口中以圖標的方式顯示，如圖所示。（2）設(shè)置背景音樂方法二：①插入一個音頻文件②選擇該音頻文件，單擊“屬性”面板中的“參數(shù)”按鈕。

③在參數(shù)對話框中單擊“＋”按鈕，在“參數(shù)”列中輸入loop，并在“值”列中輸入true。設(shè)置后可實現(xiàn)讓音頻文件循環(huán)播放。④在“參數(shù)”列中輸入hidden，值為true；設(shè)置后可隱藏播放器⑤在“參數(shù)”列中輸入autostart，值為true。設(shè)置后可自動播放音頻文件。設(shè)置結(jié)果如圖所示3.5.3視頻的插入和編輯

插入視頻的方法:將插入點放在需要插入視頻的位置，選擇“插入”|“媒體”|“插件”命令3.6超鏈接的使用3.6.1超鏈接概述3.6.2超鏈接的基本操作3.6.1超鏈接概述

1．超鏈接的概念(1)概念：超鏈接是“超級文本鏈接”的縮略語，指站點內(nèi)不同網(wǎng)頁之間、站點與Web之間的鏈接關(guān)系，它可以使站點內(nèi)的網(wǎng)頁成為機的整體，還能夠使不同站點之間建立聯(lián)系。(2)分類：內(nèi)部超鏈接：同一網(wǎng)站文檔之間的鏈接。外部超鏈接：不同網(wǎng)站文檔之間的鏈接。錨點超鏈接：同一網(wǎng)頁或不同網(wǎng)頁中指定位置的鏈接。電子郵件超鏈接：啟動郵件客戶端程序，可以寫郵件并發(fā)送到鏈接的郵箱中。2．鏈接路徑鏈接路徑可以是相對路徑也可以是絕對路徑。（1）絕對路徑：指某個文件在網(wǎng)絡(luò)上的完整路徑，包括適用的協(xié)議（如http、ftp、rtsp等）、Web服務(wù)器、路徑和文件名等。例如：file:///G|/圖片/手機圖片/1.gif（2）相對路徑：和當前文檔所在的文件夾相對的路徑。相對路徑最適合網(wǎng)站的內(nèi)部鏈接。例如：../images/m.jpg（3）根目錄相對路徑：是指從站點根文件夾到被鏈接文檔經(jīng)由的路徑，以前斜杠開頭。例如：/about/index.html3.6.2超鏈接的基本操作

1．設(shè)置超鏈接格式選擇“修改”|“頁面屬性”命令“屬性”面板中單擊“頁面屬性”按鈕，彈出“頁面屬性”對話框中設(shè)置2．創(chuàng)建外部鏈接方法：（1）選中要添加鏈接的文字（2）在“屬性”面板中的在“鏈接”文本框中直接輸入外部絕對地址。（3）在“目標”下拉列表框中選擇“_blank”。說明：“目標”下拉列表框中有4種選項：

_blank選項：單擊鏈接后，在新的瀏覽器窗口中打開鏈接文檔。

_parent選項：當鏈接文本所在的網(wǎng)頁是嵌套框架中的一部分時，被鏈接的文檔將在父框架中打開。如果不是在嵌套框架中，則會在整個瀏覽器窗口中打開鏈接文檔。

_seft：默認值，鏈接文檔將在當前網(wǎng)頁所在的窗口或框架中打開。

_top：在整個瀏覽器窗口中打開鏈接文檔，會刪除所有框架。3．創(chuàng)建內(nèi)部鏈接（1）選中要添加鏈接的對象（如：文字）（2）單擊“插入”工具欄“常用”分類中的“超鏈接”按鈕，彈出“超級鏈接”對話框。如圖所示（4）單擊“超級鏈接”對話框中的“鏈接”下拉列表框后的按鈕，在彈出的“選擇文件”對話框中選擇鏈接目標文件（5）在“超級鏈接”對話框的“目標”下拉列表框中選擇_blank選項。4．創(chuàng)建電子郵件鏈接方法：（1）選中需要建立鏈接的文本或圖片（2）單擊“插入”工具欄常用分類中的“電子郵件鏈接”按鈕，彈出“電子郵件鏈接”對話框（3）在對話框的E-mail文本框內(nèi)輸入郵箱地址。5．創(chuàng)建錨點鏈接概念：錨點鏈接，是指在文檔中設(shè)置位置標記，并在該位置定義一個名稱以方便引用。錨點鏈接通常用于跳轉(zhuǎn)到特點主題或者文檔頂部。方法：（1）將光標放置于要插入錨點的地方，（2）選擇“插入”|“命名錨記”命令，或者單擊“插入”工具欄常用分類中的“命名錨記”按鈕（3）在彈出“命名錨記”對話框中，“錨記名稱”后的文本框中輸入鏈接時引用的名稱，如BT。單擊“確定”按鈕后將在光標所在處插入一個錨記，如圖所示。3.7CSS樣式表的使用3.7.1CSS樣式表概述3.7.2創(chuàng)建和應(yīng)用CSS樣式表3.7.1CSS樣式表概述

（1）概念：層疊樣式表（CSS，CascadingStyleSheet）是一系列格式設(shè)置規(guī)則，它們控制Web頁面內(nèi)容的外觀。使用CSS設(shè)置頁面格式時，內(nèi)容與表現(xiàn)形式是相互分開的。頁面內(nèi)容（HTML代碼）位于自身的TML文件中，而定義代碼表現(xiàn)形式的CSS規(guī)則位于另一個文件（外部樣式表）或HTML文檔的另一部分（通常為<head>部分）中。（2）組成CSS格式設(shè)置規(guī)則由兩部分組成：選擇器和聲明。選擇器是標識格式元素的術(shù)語（如P、H1、類名或ID）聲明用于定義元素樣式。聲明由兩部分組成：屬性（如font-family）和值（如Helvetica）3.7.2創(chuàng)建和應(yīng)用CSS樣式表

1．創(chuàng)建CSS樣式表（1）選中“窗口”|“CSS樣式”命令，彈出“CSS樣式”面板（2）單擊“CSS樣式”面板右下角的“新建CSS規(guī)則”按鈕，彈出“新建CSS規(guī)則”對話框（3）為新建CSS樣式輸入或選擇名稱、標記或選擇器。（4）在“選擇器類型”選項組中選擇“類”，然后在“名稱”組合框框中輸入樣式名稱（如：.moviestyle）（5）在“定義在”組合框中選擇定義的樣式位置，可以是“新建樣式表文件”或“僅對該文檔”。選擇“新建樣式表文件”選項，在彈出的“保存樣式表文件為”對話框中給樣式表命名。2．定義CSS樣式表“CSS規(guī)則定義”對話框中，可以通過類型、背景、區(qū)塊、方框、邊框、列表、定位和擴展項的設(shè)置來美化頁面。在定義某個CSS樣式的時候，不需要對每一項都進行設(shè)置，需要什么效果，選擇相應(yīng)的項進行設(shè)置即可。設(shè)置時在左邊的“分類”中選擇樣式，在右邊窗格中修改該樣式的屬性。（1）文本樣式的設(shè)置。（2）背景樣式的設(shè)置。在HTML中，背景只能使用單一的色彩或利用圖像水平垂直方向的平鋪。使用CSS之后，有了更加靈活的設(shè)置。（3）區(qū)塊樣式設(shè)置。（4）方框樣式的設(shè)置。在前面我們設(shè)置過圖像的大小、設(shè)置圖像水平和垂直方向上的空白區(qū)域、設(shè)置圖像是否有文字環(huán)繞效果等。方框設(shè)置進一步完善、豐富了這些設(shè)置。（5）邊框樣式設(shè)置。邊框樣式設(shè)置可以給對象添加邊框，設(shè)置邊框的顏色、粗細、樣式。（6）列表樣式設(shè)置。（7）定位樣式的設(shè)置。“定位”項實際上是對層的設(shè)置（8）擴展樣式的設(shè)置。CSS樣式還可以實現(xiàn)一些擴展功能，這些功能集中在擴展面板上。這個面板主要包括3種效果：分頁、光標和過濾器。3．CSS樣式表的基本操作單擊CSS樣式面板右上方的擴展按鈕，或者選擇要編輯的樣式并右擊，將會彈出CSS操作菜單，CSS的相關(guān)操作都是通過這個菜單上的項目來實現(xiàn)的。（1）編輯CSS樣式。選擇CSS操作菜單中的“編輯”選項單擊“編輯樣式”按鈕，在彈出的“CSS規(guī)則定義”對話框中修改相應(yīng)的設(shè)置。（2）應(yīng)用CSS自定義樣式。①右擊在網(wǎng)頁中被選中的元素，快捷菜單中選擇“CSS樣式”，在其子菜單中選擇需要的自定義樣式。②選中要應(yīng)用樣式的對象，在“屬性”面板中選擇“樣式”下拉列表框中定義好的CSS樣式。（3）附加樣式表。在CSS面板中單擊“附加樣式表”按鈕，彈出“鏈接外部樣式表”對話框，可以鏈接外部的CSS樣式文件。3.8框架的使用3.8.1框架與框架集