網(wǎng)頁(yè)設(shè)計(jì)與制作

網(wǎng)頁(yè)設(shè)計(jì)與制作網(wǎng)站規(guī)劃在建立網(wǎng)站之前，需了解網(wǎng)站的開(kāi)發(fā)流程，按照項(xiàng)目管理模式對(duì)網(wǎng)站進(jìn)行必要的規(guī)劃、開(kāi)發(fā)、測(cè)試和發(fā)布使用。一般流程如下：建設(shè)網(wǎng)站前進(jìn)行必要的市場(chǎng)分析。明確建設(shè)網(wǎng)站的目的及功能定位。制定網(wǎng)站技術(shù)解決方案。根據(jù)網(wǎng)站的目的確定網(wǎng)站內(nèi)容、網(wǎng)站結(jié)構(gòu)和網(wǎng)站功能。進(jìn)行網(wǎng)頁(yè)設(shè)計(jì)，并根據(jù)技術(shù)方案實(shí)施網(wǎng)站建設(shè)。做出經(jīng)費(fèi)預(yù)算。網(wǎng)站測(cè)試。網(wǎng)站發(fā)布及推廣。網(wǎng)站維護(hù)。

網(wǎng)站基礎(chǔ)知識(shí)網(wǎng)站（Website），是指在因特網(wǎng)上根據(jù)一定的規(guī)定，使用HTML等工具制作的用于展示特定內(nèi)容的相關(guān)網(wǎng)頁(yè)的集合。網(wǎng)站的組成域名（DomainName），是由一串用點(diǎn)分隔的字母組成的Internet上某一臺(tái)計(jì)算機(jī)或計(jì)算機(jī)組的名稱?？臻g，常見(jiàn)網(wǎng)站空間有虛擬主機(jī)、虛擬空間、獨(dú)立服務(wù)器、VPS。程序，即建設(shè)與修改網(wǎng)站所使用的編程語(yǔ)言，換成源碼就是一堆按一定格式書(shū)寫(xiě)的文字和符號(hào)。網(wǎng)頁(yè)網(wǎng)頁(yè)（Webpage），是網(wǎng)站中的任意一個(gè)頁(yè)面，通常是HTML格式，文件擴(kuò)展名為html、或htm、或asp、或aspx、或php、或jsp等?；緲?gòu)成元素：文字、圖像、超級(jí)鏈接。閱讀方式：瀏覽器。類(lèi)型：以不同的后綴代表不同類(lèi)型的網(wǎng)頁(yè)文件。通常分為靜態(tài)頁(yè)面、動(dòng)態(tài)頁(yè)面。動(dòng)態(tài)網(wǎng)頁(yè)（activewebpage）：指網(wǎng)頁(yè)內(nèi)容可根據(jù)用戶的不同請(qǐng)求從而返回其對(duì)應(yīng)的數(shù)據(jù)，一般情況下動(dòng)態(tài)網(wǎng)頁(yè)通過(guò)數(shù)據(jù)庫(kù)進(jìn)行架構(gòu)，一般文件名均以開(kāi)發(fā)語(yǔ)言做后綴，如php、asp等。也可以說(shuō)凡是結(jié)合了HTML以外的高級(jí)程序設(shè)計(jì)語(yǔ)言和數(shù)據(jù)庫(kù)技術(shù)進(jìn)行的網(wǎng)頁(yè)編程技術(shù)生成的網(wǎng)頁(yè)都是動(dòng)態(tài)網(wǎng)頁(yè)。靜態(tài)網(wǎng)頁(yè)：指全部由HTML標(biāo)記頁(yè)面，頁(yè)面的內(nèi)容和顯示效果基本不發(fā)生變化，所有的內(nèi)容包含在網(wǎng)頁(yè)文件中。一般文件名均以htm、html、shtml等為后綴。術(shù)語(yǔ)WWW（WorldWideWeb），亦稱作“Web”、“WWW”、“'W3'”，中文名字為“萬(wàn)維網(wǎng)”，"環(huán)球網(wǎng)"等，常簡(jiǎn)稱為Web。分為Web客戶端和Web服務(wù)器程序。WWW可以讓W(xué)eb客戶端（常用瀏覽器）訪問(wèn)瀏覽Web服務(wù)器上的頁(yè)面。在這個(gè)系統(tǒng)中，每個(gè)有用的事物，稱為一樣“資源”；并且由一個(gè)全局“統(tǒng)一資源標(biāo)識(shí)符”（URL）標(biāo)識(shí)；這些資源通過(guò)超文本傳輸協(xié)議（HypertextTransferProtocol）傳送給用戶，而后者通過(guò)點(diǎn)擊鏈接來(lái)獲得資源。URL（UniformResourceLocator），統(tǒng)一資源定位符，是對(duì)可以從互聯(lián)網(wǎng)上得到的資源的位置和訪問(wèn)方法的一種簡(jiǎn)潔的表示，是互聯(lián)網(wǎng)上標(biāo)準(zhǔn)資源的地址?；ヂ?lián)網(wǎng)上的每個(gè)文件都有一個(gè)唯一的URL，它包含的信息指出文件的位置以及瀏覽器應(yīng)該怎么處理它。動(dòng)態(tài)網(wǎng)頁(yè)的URL是不固定的；而靜態(tài)網(wǎng)頁(yè)的URL是固定的。HTTP(Hypertexttransferprotocol)，超文本傳輸協(xié)議，是一種詳細(xì)規(guī)定了瀏覽器和萬(wàn)維網(wǎng)服務(wù)器之間互相通信的規(guī)則，通過(guò)因特網(wǎng)傳送萬(wàn)維網(wǎng)文檔的數(shù)據(jù)傳送協(xié)議。

網(wǎng)站配色216網(wǎng)頁(yè)安全色216網(wǎng)頁(yè)安全色：指在不同硬件環(huán)境、不同操作系統(tǒng)、不同瀏覽器中都能夠正常顯示的顏色集合（調(diào)色板），這些顏色在任何顯示設(shè)備上的顯示效果都是相同的。 網(wǎng)頁(yè)安全色是當(dāng)紅色（R）、綠色（G）、藍(lán)色（B）顏色數(shù)字信號(hào)值為（DACCount）：0,51,102,153,204和255。網(wǎng)頁(yè)文字及配色文字是網(wǎng)頁(yè)的主體。文字的優(yōu)勢(shì)主要體現(xiàn)在信息量大、所用存儲(chǔ)空間非常小，利于網(wǎng)頁(yè)的快速打開(kāi)，信息的直觀呈現(xiàn)。要求：字體不超過(guò)三種（標(biāo)題、正文、導(dǎo)航），文本字號(hào)形成對(duì)比——突出（網(wǎng)頁(yè)標(biāo)題）、層次（欄目標(biāo)題）、分明（正文，字體偏小，適于文字信息量大的內(nèi)容）規(guī)定：字號(hào)影響文字的清晰度，分辨率1024*768，正文：12號(hào)、宋體字；分辨率高于1024，正文：13-14號(hào)、宋體字；文章標(biāo)題字號(hào)偏大，一般要使用平滑（消除鋸齒）的字體。文字與背景色彩搭配：文字能見(jiàn)度：高明度色彩背景+低明度文字錯(cuò)誤色彩搭配：黃+白；綠+灰、綠+紅；紫+紅、紫+黑；青+黑前進(jìn)色：紅、黃、橙、白背景色柔和、淡雅——深色文字深色背景——淺色文字不深不淺——根據(jù)色彩選擇適合的顏色（色相、明度、飽和度） 文字色彩可以與網(wǎng)站主題相呼應(yīng)，協(xié)調(diào)主色調(diào)、副主色調(diào)等。文字色彩有劃分層次的作用，網(wǎng)頁(yè)上相同色彩的文字都屬于同一層次。文字與圖片的配色遵循三個(gè)原則：文字周?chē)谋尘氨M量單純化。圖片與文字對(duì)比盡量明顯，易于識(shí)別。（通常淺色圖片配深色文字，深色圖片配淺色和高亮度的文字）文字與背景圖片對(duì)比較弱不易識(shí)別時(shí)，可用其他色彩襯托文字的方式強(qiáng)化文字與圖片間的對(duì)比。網(wǎng)頁(yè)中的圖像圖像給人的視覺(jué)效果要比文字強(qiáng)烈得多。靈活應(yīng)用圖像，在網(wǎng)頁(yè)中可以起到點(diǎn)綴的效果。但是應(yīng)用不當(dāng)，會(huì)使網(wǎng)頁(yè)變得凌亂不堪。Web頁(yè)上的圖像文件大部分都是使用JPG和GIF格式。因?yàn)樗麄兂司哂袎嚎s比例高外，還具有跨平臺(tái)特性。圖像在網(wǎng)頁(yè)中的應(yīng)用主要有以下幾種形式。圖像標(biāo)題一般在網(wǎng)頁(yè)中都要有標(biāo)題，用以提示瀏覽者這個(gè)網(wǎng)站是做什么的，起到了導(dǎo)航的作用，應(yīng)用圖像標(biāo)題可以使網(wǎng)頁(yè)更加美觀，背景圖像的另一個(gè)重要應(yīng)用是作為網(wǎng)頁(yè)的背景。網(wǎng)頁(yè)背景千變?nèi)f化，特別是一些個(gè)人網(wǎng)站，應(yīng)用圖片背景比較多。網(wǎng)頁(yè)主圖網(wǎng)頁(yè)上除了用小圖像美化網(wǎng)頁(yè)外，通常還會(huì)在網(wǎng)頁(yè)上用一些較大的圖片來(lái)突出網(wǎng)頁(yè)主題，占滿網(wǎng)頁(yè)的整個(gè)空間。特別是主頁(yè)中用主圖的比較多，或者直接用圖片取代文字作為超級(jí)鏈接按鈕，可以使網(wǎng)頁(yè)更加美觀。網(wǎng)頁(yè)圖像分類(lèi)網(wǎng)頁(yè)圖像分為靜態(tài)圖像和動(dòng)態(tài)圖像。動(dòng)態(tài)圖像：gif動(dòng)畫(huà)：適于短小動(dòng)畫(huà)，畫(huà)面數(shù)少，圖像簡(jiǎn)單。【89a】flash動(dòng)畫(huà)（.swf）：flv視頻（.flv）：體積小，壓縮率高，適于傳播但畫(huà)面不夠清晰。靜態(tài)圖像：JPG：優(yōu)秀的圖畫(huà)品質(zhì)，較為合理的文件大小，不支持透明格式。GIF：256色，壓縮后損失圖像色彩但不影響圖像失真；支持透明格式。【87a】PNG：支持透明背景，支持48位色彩的圖像模式；平滑的透明邊緣；品質(zhì)好，體積小。網(wǎng)頁(yè)上圖片注意事項(xiàng)良好的視覺(jué)吸引力，“閱讀最省力原則”圖片要清晰，不能模糊、變形，太大的圖片要進(jìn)行分割。圖片的主體含義要簡(jiǎn)單明了，圖片上的文字要清晰容易識(shí)別。采用的圖片顏色要符合網(wǎng)頁(yè)整體色彩。 關(guān)于色彩由光譜可以得出6個(gè)基礎(chǔ)色相，增加過(guò)渡色可形成12色相環(huán)和24色相環(huán)。同類(lèi)色：指在同一色相中不同的顏色變化。鄰近色：在色環(huán)上任一顏色同其毗鄰之色。補(bǔ)色：在色環(huán)上彼此相距180°的兩個(gè)色相互為補(bǔ)色。色彩對(duì)比網(wǎng)頁(yè)色彩搭配主要從色彩冷暖、面積、色相、明度、純度。色相對(duì)比色相對(duì)比：兩種以上色彩組合時(shí)，由于色相差別而形成的色彩對(duì)比效果。對(duì)比強(qiáng)弱關(guān)系可以從色相環(huán)上的距離（角度）入手，距離越小對(duì)比越弱；反之亦然。有彩色間的對(duì)比，按弱→強(qiáng)關(guān)系分為：同類(lèi)色相對(duì)比（無(wú)色相差、色相距離在45°，基于明度和純度的對(duì)比）——單調(diào)鄰近色相對(duì)比（色相距離在90°左右）——較為豐富、耐看對(duì)比色相對(duì)比（色相距離在130°左右）——鮮明、強(qiáng)烈（配色時(shí)需要考慮主色與次色間的關(guān)系、色彩面積，降低視覺(jué)疲勞）互補(bǔ)色對(duì)比（色相距離在180°左右）——色彩對(duì)比很強(qiáng)（易產(chǎn)生不安定感，配色時(shí)需考慮色彩面積、色彩的分散度）明度對(duì)比明度對(duì)比：指色彩明暗度的對(duì)比，也稱作黑白度對(duì)比，即黑、白、灰效果。純度對(duì)比純度對(duì)比分為高、中、低純度。純度對(duì)比表現(xiàn)出色彩艷麗效果，也是決定色調(diào)感覺(jué)的關(guān)鍵。特點(diǎn)：增強(qiáng)用色的鮮艷感，即通常說(shuō)的明確感。表現(xiàn)：艷麗、生動(dòng)、活潑無(wú)彩色對(duì)比，如黑與白、深灰與淺灰。表現(xiàn)：大方、穩(wěn)重、高雅、樸素冷暖對(duì)比暖色系：顏色接近紅、橙、黃。冷色系：顏色偏向藍(lán)、青。中色系：綠色和紫色面積對(duì)比同一視覺(jué)范圍內(nèi)色彩的面積不同會(huì)產(chǎn)生不同的對(duì)比效果。網(wǎng)頁(yè)色彩的搭配網(wǎng)頁(yè)的色調(diào)：網(wǎng)頁(yè)中的色彩，總存在某種內(nèi)容聯(lián)系組成一個(gè)統(tǒng)一的整體，從而形成畫(huà)面色彩的趨勢(shì)。主色調(diào)——頁(yè)面色彩的主要色調(diào)。顯示站點(diǎn)整體內(nèi)容和風(fēng)格；其他配色面積一般不大于該視覺(jué)面積。輔色調(diào)——烘托主色調(diào)，支持主色調(diào)，協(xié)助主色調(diào)營(yíng)造整體視覺(jué)氛圍（面積次之）。突出顏色——強(qiáng)調(diào)色，用于突出主題效果，一般多用于按鈕、標(biāo)簽之類(lèi)。背景色——協(xié)調(diào)、襯托整體

軟件介紹軟件界面常見(jiàn)問(wèn)題窗口不顯示插入工具欄。[方法]Ctrl+F2；或者菜單命令[窗口-插入]，勾選。找不到屬性窗口。[方法]Ctrl+F3；或者菜單命令[窗口-屬性]，勾選。文件面板顯示根節(jié)點(diǎn)不是命名的站點(diǎn)名稱。[方法]文件面板-管理站點(diǎn)；或者菜單命令[站點(diǎn)-管理站點(diǎn)]。窗口顯示的信息不完整，感覺(jué)窗口小了。[方法]檢查計(jì)算機(jī)的屏幕分辨率，分辨率不低于1024*768。

站點(diǎn)建立制作網(wǎng)站之前除了準(zhǔn)備網(wǎng)站資料、規(guī)劃網(wǎng)站結(jié)構(gòu)、設(shè)計(jì)網(wǎng)站布局以外，最好創(chuàng)建一個(gè)本地站點(diǎn)，易于管理和上傳。特別是制作動(dòng)態(tài)網(wǎng)站，本地站點(diǎn)的創(chuàng)建必不可少。站點(diǎn)的建立應(yīng)注意以下情況：站點(diǎn)的路徑結(jié)構(gòu)中不能含有中文，即文件夾、文件的命名都不含有中文，且命名有規(guī)律易查找。習(xí)慣上在站點(diǎn)根文件夾下建立用于存放圖片的子文件夾，如果網(wǎng)站中用到其他較多媒體類(lèi)文件也可以建立相應(yīng)的文件夾存放，但目錄層次不易過(guò)深。創(chuàng)建網(wǎng)站的素材不能放在站點(diǎn)根文件夾中，站點(diǎn)文件夾中存入的圖片、音頻、視頻或者動(dòng)畫(huà)只能是真正在網(wǎng)頁(yè)中應(yīng)用到的元素，一般在制作頁(yè)面的過(guò)程中都會(huì)提示保存到站點(diǎn)文件夾下。創(chuàng)建站點(diǎn)的視頻演示創(chuàng)建站點(diǎn)的命令菜單命令：[站點(diǎn)-新建站點(diǎn)]文件面板：[管理站點(diǎn)-新建]創(chuàng)建站點(diǎn)的關(guān)鍵步驟說(shuō)明新建站點(diǎn)對(duì)話框中，[基本]選項(xiàng)卡相當(dāng)于一個(gè)建立站點(diǎn)的向?qū)?，引?dǎo)設(shè)計(jì)者一步步地完成基本的站點(diǎn)設(shè)置，[高級(jí)]選項(xiàng)卡用于站點(diǎn)屬性的詳細(xì)設(shè)置。初學(xué)者可先在[基本]選項(xiàng)卡中完成站點(diǎn)的基本設(shè)置，再進(jìn)入[高級(jí)]選項(xiàng)卡做進(jìn)一步設(shè)置，如“默認(rèn)圖像文件夾”，應(yīng)注意：1）設(shè)置了默認(rèn)圖像文件夾后，制作頁(yè)面時(shí)每次插入圖像都會(huì)自動(dòng)將應(yīng)用到的圖片自動(dòng)存放到該文件夾中；2）不能將所有下載或處理過(guò)的圖像素材都拷貝到該文件夾中，造成不必要的存儲(chǔ)負(fù)擔(dān)。新建站點(diǎn)的名稱可以包含中文、符號(hào)或字母，但站點(diǎn)路徑不能包含中文和符號(hào)。創(chuàng)建站點(diǎn)的關(guān)聯(lián)操作站點(diǎn)編輯：進(jìn)行站點(diǎn)定義的補(bǔ)充設(shè)置或者重新設(shè)置。站點(diǎn)刪除：刪除無(wú)關(guān)站點(diǎn)或者冗余站點(diǎn)。站點(diǎn)導(dǎo)出：導(dǎo)出站點(diǎn)信息，并以.ste為擴(kuò)展名的存儲(chǔ)一個(gè)站點(diǎn)定義文件，該文件一般存儲(chǔ)在站點(diǎn)根文件夾內(nèi)。站點(diǎn)導(dǎo)入：將站點(diǎn)根文件夾內(nèi)的站點(diǎn)定義文件導(dǎo)入（擴(kuò)展名.ste），導(dǎo)入中注意站點(diǎn)根文件夾和站點(diǎn)圖像文件夾的指向，便于快速、正確的重構(gòu)站點(diǎn)。

常用布局方法簡(jiǎn)介版面布局基礎(chǔ)網(wǎng)頁(yè)默認(rèn)習(xí)慣網(wǎng)站標(biāo)志放在頁(yè)面上部豎排導(dǎo)航時(shí)，導(dǎo)航放在頁(yè)面左側(cè)；橫排導(dǎo)航時(shí)，放在網(wǎng)站標(biāo)志或頂部廣告之下版權(quán)信息放在頁(yè)面底部第一屏：是指打開(kāi)一個(gè)網(wǎng)站頁(yè)面不拖動(dòng)滾動(dòng)條的情況下能看到的頁(yè)面部分。分辨率800*6001024*768第一屏760*4201002*600頁(yè)面寬度：<=1002頁(yè)面高度：<=3*600表格表格是Dreamweaver中最常用的布局工具，不但可以精確定位網(wǎng)頁(yè)在瀏覽器中的顯示位置，還可以控制網(wǎng)頁(yè)元素在網(wǎng)頁(yè)中的精確布局。創(chuàng)建表格及表格屬性設(shè)置的視頻演示創(chuàng)建表格的命令菜單命令：[插入記錄-表格]插入工具欄：[常用-表格]表格的重要屬性說(shuō)明表格的寬度可以用兩種方式表示：像素、百分比。在布局時(shí)，最外圍的表格屬性（寬度）單位必須用像素，而內(nèi)部的嵌套表格寬度單位可以使用像素，也可以用百分比，使用百分較為靈活。嵌套的表格之間需要緊密相貼，則表格屬性中應(yīng)將“邊距”、“間距”和“邊框”值設(shè)置為0。表格可以嵌套表格，但無(wú)法交叉；表格交叉的錯(cuò)誤容易出現(xiàn)在代碼部分?；镜谋砀駱?biāo)簽<table>：定義表格<th>：定義表頭<tr>：定義表格行<td>：定義表格單元（tabledata），即數(shù)據(jù)單元格的內(nèi)容。表格標(biāo)簽的可選屬性DTD指示此屬性允許在哪種DTD中使用。S=Strict,T=Transitional,F=Frameset.屬性值描述DTD\o"HTML<table>標(biāo)簽的align屬性"alignleftcenterright不贊成使用。請(qǐng)使用樣式代替。規(guī)定表格相對(duì)周?chē)氐膶?duì)齊方式。TF\o"HTML<table>標(biāo)簽的bgcolor屬性"bgcolorrgb(x,x,x)#xxxxxxcolorname不贊成使用。請(qǐng)使用樣式代替。規(guī)定表格的背景顏色。TF\o"HTML<table>標(biāo)簽的border屬性"borderpixels規(guī)定表格邊框的寬度。STF\o"HTML<table>標(biāo)簽的cellpadding屬性"cellpaddingpixels%規(guī)定單元邊沿與其內(nèi)容之間的空白。STF\o"HTML<table>標(biāo)簽的cellspacing屬性"cellspacingpixels%規(guī)定單元格之間的空白。STF\o"HTML<table>標(biāo)簽的frame屬性"frame（表格外框線）above只外部的頂部邊線STFbelow只外部的底部邊線border顯示表格的邊框線box顯示表格的整體hsides顯示外部的頂部和底部邊線rhs只顯示外部的右側(cè)邊線lhs只顯示外部的左側(cè)邊線void外部的所有邊線全部不顯示vsides只顯示外部的左側(cè)和右側(cè)邊線\o"HTML<table>標(biāo)簽的rules屬性"rules（表格內(nèi)部分割線）none內(nèi)部所有線框不顯示STFgroups內(nèi)部橫向和縱向線框不顯示rows只顯示內(nèi)部的橫向線框cols只顯示內(nèi)部的縱向線框all顯示所有內(nèi)部線框\o"HTML<table>標(biāo)簽的summary屬性"summarytext規(guī)定表格的摘要。STF\o"HTML<table>標(biāo)簽的width屬性"width%pixels規(guī)定表格的寬度。STF表格標(biāo)簽的標(biāo)準(zhǔn)屬性id,class,title,style,dir,lang,xml:lang表格的其他操作導(dǎo)入或?qū)С霰砀駭?shù)據(jù)菜單命令：[插入記錄-表格對(duì)象-導(dǎo)入表格式數(shù)據(jù)]，其中導(dǎo)入的數(shù)據(jù)要具有制表符、逗號(hào)、分號(hào)、引號(hào)或者其他定界符?；蛘卟藛蚊睿篬文件-導(dǎo)入]，可選擇“表格式數(shù)據(jù)”或者Excel文檔。菜單命令：[文件-導(dǎo)出]。表格的排序菜單命令：[命令-排序表格]典型案例

表格布局由于最初表格并不是用于布局設(shè)計(jì)，而是由于顯示數(shù)據(jù)的，所以對(duì)于初學(xué)者來(lái)說(shuō)，要想使用表格設(shè)計(jì)出布局合理的頁(yè)面，往往會(huì)適得其反。為了簡(jiǎn)化利用表格布局頁(yè)面，Dreamweaver中就特意提供了一種布局模式，在該模式下使用布局工具，設(shè)計(jì)者可以輕松地在頁(yè)面中畫(huà)出布局表格以及單元格，然后對(duì)其進(jìn)行修改、移動(dòng)等，并且可以方便地設(shè)置布局表格和單元格的屬性，布局表格可以有一定的固定寬度，也可以占據(jù)整個(gè)瀏覽器窗口。設(shè)置布局模式的參數(shù)及命令菜單命令：[編輯—首選參數(shù)]，在左側(cè)的[分類(lèi)]欄中選中[布局模式]選項(xiàng)，即可為布局模式中的表格和單元格邊框設(shè)置不同的顏色。插入工具欄：[布局-擴(kuò)展]或者菜單命令：[查看-表格模式-布局模式]或者ALlt+F6組合鍵在布局模式中創(chuàng)建表格和單元格在布局模式中可以在文檔中隨意地繪制表格，在布局模式下點(diǎn)擊插入工具欄中的圖標(biāo)，鼠標(biāo)在文檔窗口即可拖動(dòng)繪制布局表格；點(diǎn)擊圖標(biāo)，拖動(dòng)鼠標(biāo)即可繪制布局單元格。需要注意以下幾個(gè)問(wèn)題：不能在布局單元格中繪制表格。布局表格可以嵌套，布局單元格不可以嵌套，布局表格和布局單元格均不可以交疊，即在繪制布局表格和布局單元格時(shí)，不能直接在布局表格的旁邊插入其他布局表格和布局單元格，只能在布局表格內(nèi)或表格的下方添加其他布局表格和布局單元格。布局表格和布局表格之間不能相互重疊，創(chuàng)建相鄰的布局表格時(shí)（小于8像素），Dreamweaver會(huì)自動(dòng)將它們對(duì)齊，如果在繪制布局表格是按下Atl鍵，可以取消Dreamweaver的自動(dòng)對(duì)齊功能。移動(dòng)布局表格和單元格：可使用Dreamweaver提供的網(wǎng)格線作為輔助向?qū)В琜查看-網(wǎng)格-顯示網(wǎng)格]命令顯示網(wǎng)格線，或者按下Ctrl+shift+G快捷鍵。移動(dòng)表格的方法是：?jiǎn)螕舨季直砀駱?biāo)簽，然后拖動(dòng)表格到合適的位置即可；如果同時(shí)按住Shift鍵，每次可以移動(dòng)10個(gè)像素的距離，注意只有嵌套表格才可以移動(dòng)。調(diào)整布局表格尺寸的方法是:單擊布局表格標(biāo)簽，表格將出現(xiàn)8個(gè)控制柄，然后拖動(dòng)控制柄到合適的位置即可。調(diào)整和移動(dòng)單元格的方法：?jiǎn)螕舨季謫卧竦倪吙蜻M(jìn)行拖動(dòng)，或者按下Ctrl鍵的同時(shí)單擊布局單元格進(jìn)行拖動(dòng)，當(dāng)?shù)竭_(dá)合適的位置時(shí)，釋放鼠標(biāo)即可。如果要改變單元格的大小，可以先選中該單元格，然后拖動(dòng)控制柄到滿意的尺寸即可。布局表格需注意的屬性設(shè)置：選項(xiàng)作用刪除所有間隔圖像按鈕：清除表格中的所有間隔刪除嵌套按鈕：清除嵌套表格，只有當(dāng)存在嵌套表格時(shí)，該選項(xiàng)才顯示

模板在制作具有幾十個(gè)甚至幾百個(gè)風(fēng)格基本相似的網(wǎng)站時(shí)，如果每次都重新設(shè)定網(wǎng)頁(yè)結(jié)構(gòu)以及相同欄目下的導(dǎo)航條、各類(lèi)圖標(biāo)就會(huì)顯得非常麻煩，如果借助Dreamweaver中的模版功能就可以簡(jiǎn)化操作。創(chuàng)建模板及模板設(shè)置的視頻演示創(chuàng)建模板的命令將現(xiàn)有的網(wǎng)頁(yè)文檔創(chuàng)建為模板（方法一）：菜單命令：[文件-另存為]，選擇相應(yīng)的站點(diǎn)名稱。在該站點(diǎn)根文件夾下新建子文件夾Templates，將保存路徑切換到該文件夾下。保存類(lèi)型：模板文件（*.dwt），輸入模板名稱并保存。新建空模板（方法二）：[文件-新建-空模板-HTML模板]模板的重要說(shuō)明模版實(shí)際是擴(kuò)展名為.dwt的文檔，必須存放在站點(diǎn)根目錄的Templates文件夾中，才能被站點(diǎn)識(shí)別。模板中應(yīng)該至少包含一個(gè)可編輯區(qū)域，否則模板無(wú)效，無(wú)法編輯該模板的頁(yè)面。兩種創(chuàng)建方法的區(qū)別模版文件夾不是原本就有的，如果是使用方法二的方式創(chuàng)建，則Templates文件夾會(huì)自動(dòng)生成；而如果使用方法一的方式創(chuàng)建，則需要手動(dòng)創(chuàng)建Templates文件夾。其中一個(gè)重要區(qū)別在代碼部分，方法二將在head標(biāo)簽內(nèi)把title標(biāo)簽包含在一個(gè)可編輯區(qū)域內(nèi)，那么之后由模板創(chuàng)建的各個(gè)頁(yè)面都可以設(shè)置不同的頁(yè)面標(biāo)題；而方法一則需要在代碼視圖手動(dòng)輸入可編輯區(qū)域的代碼，將title標(biāo)簽至于可編輯區(qū)域中，否則以后創(chuàng)建的各個(gè)頁(yè)面都只能是統(tǒng)一的一個(gè)頁(yè)面標(biāo)題，無(wú)法靈活設(shè)置。另一個(gè)重要區(qū)別體現(xiàn)在CSS的使用上。根據(jù)之上的區(qū)別，如果將模板中的CSS定義也置于可編輯區(qū)域，則由模板創(chuàng)建的頁(yè)面的CSS定義也將帶來(lái)多樣的變化。模板的其他操作從模板創(chuàng)建文件菜單命令：[新建-模板中的頁(yè)]，選擇站點(diǎn)及其模板文件從當(dāng)前模板中分離菜單命令：[修改-模板-從模板中分離]將一般頁(yè)面套用到模板菜單命令：[修改-模板-應(yīng)用模板到頁(yè)]修改模板并更新站點(diǎn)當(dāng)已經(jīng)利用模板創(chuàng)建了多個(gè)網(wǎng)頁(yè)時(shí)，又想更改模板中的某些網(wǎng)頁(yè)元素，可以直接在模板中更改，按Ctrl+S鍵保存，彈出[更新模板文件]對(duì)話框，單擊[更新]按鈕打開(kāi)[更新頁(yè)面]對(duì)話框自動(dòng)更新，當(dāng)保存模板的同時(shí)也更新了基于模板建立的所有網(wǎng)頁(yè)。模板中的區(qū)域類(lèi)型模板中有些區(qū)域是不能編輯的，稱為鎖定區(qū)；有些區(qū)域則是可以編輯的，稱為可編輯區(qū)域。Dreamweaver提供了4種模板區(qū)域類(lèi)型，即：可編輯區(qū)域、重復(fù)區(qū)域、可選區(qū)域和可編輯標(biāo)簽屬性?？删庉媴^(qū)域是基于模板的文檔中的未鎖定區(qū)域。操作：插入工具欄[常用-可編輯區(qū)域]或者菜單命令[插入記錄-模板對(duì)象-可編輯區(qū)域]或者組合鍵Ctrl+Alt+V。重復(fù)區(qū)域（RepeatingRegion）是文檔中重復(fù)顯示的部分，屬于不可編輯區(qū)域。在模板中定義重復(fù)區(qū)域，可以讓用戶在網(wǎng)頁(yè)中創(chuàng)建可擴(kuò)展的列表，并可保持模板中表格的設(shè)計(jì)不變。重復(fù)區(qū)域分為重復(fù)區(qū)和重復(fù)表（RepeatingTable），可以將整個(gè)表格或者一個(gè)單元格定義為重復(fù)區(qū)域，但是不可以一次將多個(gè)單元格定義為重復(fù)區(qū)域；如果要在重復(fù)區(qū)域中編輯不同的內(nèi)容，必須在重復(fù)區(qū)域中插入可編輯區(qū)域。操作：首先在文檔窗口中選擇想要設(shè)置為重復(fù)區(qū)域的文本或內(nèi)容，執(zhí)行菜單命令[插入記錄-模板對(duì)象-重復(fù)區(qū)域]或者插入工具欄：[常用-重復(fù)區(qū)域]按鈕可選區(qū)域是在創(chuàng)建模板時(shí)定義的用于顯示和隱藏特別標(biāo)簽的區(qū)域。在使用模板創(chuàng)建網(wǎng)頁(yè)時(shí)，對(duì)于可選區(qū)域的內(nèi)容（如文本、圖片等），可以選擇顯示或者不顯示。使用可選區(qū)域可以控制不一定在基于模板的文檔中顯示的內(nèi)容。使用可選區(qū)域，在這些區(qū)域中用戶無(wú)法編輯內(nèi)容?？蛇x區(qū)域的模板選項(xiàng)卡在單詞if之后。根據(jù)模板中設(shè)置的條件，可以定義該區(qū)域在它們所創(chuàng)建的頁(yè)面中是否可見(jiàn)。操作：先在模板文檔中選擇需要將其設(shè)置為可編輯區(qū)域的文本或內(nèi)容，然后單擊插入工具欄[常用-模板下拉箭頭按鈕，從彈出的下拉菜單中選擇[可選區(qū)域]命令]設(shè)置：選中可選區(qū)域，在屬性面板上點(diǎn)擊“編輯”命令，在“高級(jí)”選項(xiàng)卡中為區(qū)域設(shè)置現(xiàn)有參數(shù)或者表達(dá)式，指定區(qū)域是否可見(jiàn)?？删庉嫎?biāo)簽屬性，是指允許基于模板的文檔中可進(jìn)行修改的屬性的標(biāo)簽定義?？删庉嫎?biāo)簽屬性提供4種類(lèi)型：文本、布爾值、顏色和URL。利用可編輯標(biāo)簽屬性這一功能，在設(shè)計(jì)模板的時(shí)候，就可以根據(jù)網(wǎng)站的總體規(guī)劃，解除模板中某些頁(yè)面元素的某個(gè)或某些屬性的鎖定，使之可以編輯，從而設(shè)計(jì)出風(fēng)格大體一致但又有適當(dāng)變化的一組網(wǎng)頁(yè)來(lái)。操作：首先在文檔窗口中選擇想要設(shè)置為可編輯標(biāo)簽屬性的項(xiàng)目或內(nèi)容，菜單命令[修改-模板-令屬性可編輯]。典型案例

框架及浮動(dòng)框架我們都知道一個(gè)網(wǎng)站是由幾個(gè)甚至幾十個(gè)網(wǎng)頁(yè)組成的，如果網(wǎng)站中的所有網(wǎng)頁(yè)是同一個(gè)布局，并且其中在相同的位置有相同的網(wǎng)頁(yè)元素時(shí)，這時(shí)就可以使用另外一種方式來(lái)制作網(wǎng)站，那就是框架。框架網(wǎng)頁(yè)與表格網(wǎng)頁(yè)不同，框架網(wǎng)頁(yè)包括表格網(wǎng)頁(yè)，正確地說(shuō)框架網(wǎng)頁(yè)是由多個(gè)表格網(wǎng)頁(yè)組成而成?？蚣芫W(wǎng)頁(yè)由框架集和框架兩個(gè)部分組成。框架集是在一個(gè)文檔內(nèi)定義一組框架結(jié)構(gòu)的HTML網(wǎng)頁(yè)，即框架集定義了頁(yè)面顯示的框架數(shù)、框架的大小、載入框架的網(wǎng)頁(yè)源和其他可以定義的屬性等。單個(gè)框架是指在網(wǎng)頁(yè)上定義的一個(gè)區(qū)域，主要指向?qū)⑤d入的網(wǎng)頁(yè)源。創(chuàng)建框架及框架屬性設(shè)置的視頻演示創(chuàng)建框架及框架集的準(zhǔn)備工作菜單命令：[查看-可視化助理-框架邊框]，勾選“框架邊框”，將框架的邊框?qū)傩栽O(shè)置為可見(jiàn)。菜單命令：[窗口-框架]，或者組合鍵Shift+F2。創(chuàng)建框架的命令插入工具欄：[布局-框架]，選擇框架樣式。如果選擇多個(gè)框架結(jié)構(gòu)，將逐個(gè)按說(shuō)選拆分框架。或者菜單命令：[文件-新建-示例中的頁(yè)-框架集]，選擇框架集的樣式?；蛘卟藛蚊睿篬插入-HTML-框架]，從彈出的子菜單中選擇框架樣式?？蚣艿闹匾f(shuō)明依據(jù)框架的拆分方式，可看出框架的層次是嵌套形式的，當(dāng)有行列組合搭配的框架結(jié)構(gòu)時(shí)，除總框架集外一定還內(nèi)嵌著其他的框架集，故而在設(shè)置框架的行高或者列寬時(shí)總是相對(duì)于其所在的框架集內(nèi)而進(jìn)行設(shè)置?？虼翱偸前从缮隙?、由左至右的次序?？蚣芗奶攸c(diǎn)使得在使用框架方式創(chuàng)建的網(wǎng)站在保存時(shí)最好使用菜單命令[文件-保存全部]，更為快捷和完整。由于框架的窗口結(jié)構(gòu)，在為網(wǎng)頁(yè)元素設(shè)置超級(jí)鏈接時(shí)增加了結(jié)構(gòu)中的多個(gè)框架，所以當(dāng)設(shè)置超級(jí)鏈接時(shí)必須指明鏈接目標(biāo)，使之能在指定的窗口中打開(kāi)。框架的屬性設(shè)置中包含框架集和單個(gè)框架的屬性設(shè)置，可借助框架工具面板，選擇框架集或者框架進(jìn)行屬性設(shè)置；其中單個(gè)框架的屬性設(shè)置除框架自身屬性設(shè)置（文件源、滾動(dòng)、是否調(diào)整大小、邊界高度、邊界寬度、邊框、邊框顏色）外，也和一般的基本的網(wǎng)頁(yè)頁(yè)面一般設(shè)置。框架的操作添加框架菜單命令：[修改-框架集]，選擇拆分框架的方法?；蛘卟僮鳎簩⒐鈽?biāo)放置于網(wǎng)頁(yè)編輯窗口的邊緣或者父框架的邊框上，拖動(dòng)鼠標(biāo)到擬增加的位置釋放，即可增加框架結(jié)構(gòu)。刪除框架將光標(biāo)放置于要?jiǎng)h除的框架的邊框之上，并且拖拽框架邊框到父框架邊框或者是網(wǎng)頁(yè)編輯窗口邊緣，即可刪除框架結(jié)構(gòu)。

框架標(biāo)簽及說(shuō)明標(biāo)記類(lèi)型譯名或意義作用備注<FRAMESET>●定義框架集定義如何將窗口分割為框架，即定義了一系列的行或者列<FRAME>○定義框架定義單個(gè)框架，即定義了放置在框架中的HTML文檔<IFRAME>○浮動(dòng)框架在頁(yè)面內(nèi)插入浮動(dòng)框架IE<NOFRAMES>●不支持框架設(shè)定當(dāng)瀏覽器不支持框架時(shí)的提示<NOFRAMES>當(dāng)使用的瀏覽器版本太低不支持框架功能時(shí)，為了避免瀏覽時(shí)一片空白可使用<NOFRAMES>標(biāo)簽，<NOFRAMES>與</NOFRAMES>之間的內(nèi)容就能出現(xiàn)在使用者的瀏覽器窗口。這些內(nèi)容可以是提醒瀏覽者采用新的瀏覽器的字句，也可以是一個(gè)沒(méi)有框架的網(wǎng)頁(yè)或切換到?jīng)]有框架的版本的鏈接均可。Frame標(biāo)簽的標(biāo)準(zhǔn)屬性與可選屬性可選屬性值描述\o"HTML<frame>標(biāo)簽的frameborder屬性"frameborder01規(guī)定是否顯示框架周?chē)倪吙颉o"HTML<frame>標(biāo)簽的longdesc屬性"longdescURL規(guī)定一個(gè)包含有關(guān)框架內(nèi)容的長(zhǎng)描述的頁(yè)面。\o"HTML<frame>標(biāo)簽的marginheight屬性"marginheightpixels定義框架的上方和下方的邊距。\o"HTML<frame>標(biāo)簽的marginwidth屬性"marginwidthpixels定義框架的左側(cè)和右側(cè)的邊距。\o"HTML<frame>標(biāo)簽的name屬性"namename規(guī)定框架的名稱。\o"HTML<frame>標(biāo)簽的noresize屬性"noresizenoresize規(guī)定無(wú)法調(diào)整框架的大小。\o"HTML<frame>標(biāo)簽的scrolling屬性"scrollingyesnoauto規(guī)定是否在框架中顯示滾動(dòng)條。\o"HTML<frame>標(biāo)簽的src屬性"srcURL規(guī)定在框架中顯示的文檔的URL。標(biāo)準(zhǔn)屬性：id,class,title,styleFrameset標(biāo)簽的可選屬性與標(biāo)準(zhǔn)屬性可選屬性值描述colspixels%*定義框架集中列的數(shù)目和尺寸。rowspixels%*定義框架集中行的數(shù)目和尺寸。標(biāo)準(zhǔn)屬性：id,class,title,style浮動(dòng)框架浮動(dòng)框架也叫內(nèi)聯(lián)框架、行內(nèi)框架，標(biāo)簽<iframe>，是將一個(gè)HTML文件嵌入在另一個(gè)HTML中顯示，即將HTML文件直接內(nèi)嵌于一個(gè)HMTL中，與之文件內(nèi)容相互融合，成為一個(gè)整體。操作方法：插入工具欄：[布局-浮動(dòng)框架]代碼視圖：在代碼視圖中輸入<iframe></iframe>，并為<iframe>添加必要的屬性，如src、width、height、target等。

浮動(dòng)框架標(biāo)簽屬性值描述描述\o"HTML<iframe>標(biāo)簽的align屬性"alignleftrighttopmiddlebottom不贊成使用。請(qǐng)使用樣式代替。規(guī)定如何根據(jù)周?chē)脑貋?lái)對(duì)齊此框架。\o"HTML<iframe>標(biāo)簽的frameborder屬性"frameborder10規(guī)定是否顯示框架周?chē)倪吙?。\o"HTML<iframe>標(biāo)簽的height屬性"heightpixels%規(guī)定iframe的高度。\o"HTML<iframe>標(biāo)簽的longdesc屬性"longdescURL規(guī)定一個(gè)頁(yè)面，該頁(yè)面包含了有關(guān)iframe的較長(zhǎng)描述。\o"HTML<iframe>標(biāo)簽的marginheight屬性"marginheightpixels定義iframe的頂部和底部的邊距。\o"HTML<iframe>標(biāo)簽的marginwidth屬性"marginwidthpixels定義iframe的左側(cè)和右側(cè)的邊距。\o"HTML<iframe>標(biāo)簽的name屬性"nameframe_name規(guī)定iframe的名稱。\o"HTML<iframe>標(biāo)簽的sandbox屬性"sandbox""allow-formsallow-same-originallow-scriptsallow-top-navigation啟用一系列對(duì)<iframe>中內(nèi)容的額外限制。（HTML5）\o"HTML<iframe>標(biāo)簽的scrolling屬性"scrollingyesnoauto規(guī)定是否在iframe中顯示滾動(dòng)條。\o"HTML<iframe>標(biāo)簽的seamless屬性"seamlessseamless規(guī)定<iframe>看上去像是包含文檔的一部分。（HTML5）\o"HTML<iframe>標(biāo)簽的src屬性"srcURL規(guī)定在iframe中顯示的文檔的URL。\o"HTML<iframe>標(biāo)簽的srcdoc屬性"srcdocHTML_code規(guī)定在<iframe>中顯示的頁(yè)面的HTML內(nèi)容。（HTML5）\o"HTML<iframe>標(biāo)簽的width屬性"widthpixels%定義iframe的寬度。典型案例層（APDiv）層與表格相同，都是在網(wǎng)頁(yè)設(shè)計(jì)過(guò)程中用來(lái)放置頁(yè)面元素的容器，在一個(gè)網(wǎng)頁(yè)中可以由多個(gè)層存在，與表格之間最大的區(qū)別在于層可以重疊，可以決定其是否可見(jiàn)，可自定義各層之間的層次關(guān)系。在高版本中將層的名稱用APDiv來(lái)描述。層是一種新的網(wǎng)頁(yè)元素定位技術(shù)，使用層可以自由控制網(wǎng)頁(yè)元素的位置。層可以放置在頁(yè)面中的任意位置，還可以控制某個(gè)層是顯示在前面還是后面，是顯示還是隱藏。層是指存放用DIV和SPAN標(biāo)簽描述的HTML內(nèi)容的容器。層可以包含文本、圖像、表單、插件，甚至層內(nèi)還可以包含其他層。在Dreamweaver中，可以使用兩種處理頁(yè)面內(nèi)容格式的層：CSS層和Netscape層。CSS層使用DIV和SPAN標(biāo)簽來(lái)定義，由W3C組織給出，是一種非常實(shí)用的網(wǎng)頁(yè)元素定義規(guī)則，能夠使網(wǎng)頁(yè)制作者有效地定制、改善網(wǎng)頁(yè)。Netscape層使用LAYER和ILAYER標(biāo)簽來(lái)確定層在頁(yè)面中的位置，由Netscape公司定義。創(chuàng)建層（APDiv）及其屬性設(shè)置的視頻演示創(chuàng)建層（APDiv）的準(zhǔn)備工作菜單命令：[編輯-首選參數(shù)-不可見(jiàn)元素]，勾選“AP元素的錨點(diǎn)”，使得層錨記可以在編輯窗口顯示。菜單命令：[窗口-AP元素]，或者快捷鍵F2。創(chuàng)建層（APDiv）的命令 插入工具欄：[布局-繪制APDiv]，在編輯窗口拖動(dòng)鼠標(biāo)繪制層；或者按住按鈕，從插入面板中拖到文檔窗口中即可；當(dāng)按下Ctrl鍵不放，在文檔窗口中就可以連續(xù)畫(huà)出不同的層。 菜單命令：[插入記錄-布局對(duì)象-APDiv] 層的重要屬性說(shuō)明創(chuàng)建層的方法中，使用插入工具欄繪制的層使用的是絕對(duì)定位，即相對(duì)于瀏覽器的位置信息；而使用菜單命令插入的層使用的是相對(duì)定位，位置相對(duì)于包含層的容器中，容器可以是表格、Div等。一個(gè)APDiv瞄記代表一個(gè)層，可以通過(guò)剪切、復(fù)制、粘貼層瞄記來(lái)完成對(duì)層的剪切、復(fù)制和粘貼層。使用[AP元素]面板可以管理文檔中的層，可以防止重疊，更改其可見(jiàn)性，允許嵌套，以及選擇一個(gè)或多個(gè)層。[AP元素]面板中的“Z”用數(shù)字描述，表明層的順序，值得增大表明其越位于頁(yè)面頂層，是后建立的層；故可以修改層的“Z”值，使多個(gè)層位于同一層次；在面板中，選中一個(gè)層并且按下Ctrl鍵，然后將其拖動(dòng)到要嵌入的層的位置，可以將其變?yōu)樵搶拥那短讓?。層?huì)隨著窗口大小、分辨率等原因發(fā)生錯(cuò)位的現(xiàn)象，可以借助修改成的相關(guān)屬性來(lái)保證其位置的穩(wěn)定。盡量使用容器放置層，如表格；并使用菜單命令插入層，根據(jù)需要在屬性面板中調(diào)整層的大小、顏色等。如果使用的是插入工具欄繪制的層，則在代碼視圖修改成的屬性：1）刪除層的left、top屬性；2）增加margin-top、margin-left屬性，需要說(shuō)明的是除了在Dreamweaver8版本外，高版本的Dreamweaver中的這兩個(gè)屬性的設(shè)置將在對(duì)應(yīng)層的CSS描述部分修改，而不再在行內(nèi)style中修改；3）position屬性默認(rèn)就是absolute。層的嵌套并不是單指外觀上的一層位于另一層內(nèi)，其本質(zhì)是一層的HTML代碼嵌套在另一層的HTML代碼之內(nèi)；故在視覺(jué)上嵌套的層會(huì)出現(xiàn)跟隨移動(dòng)效果一致但卻不在同一位置。幾個(gè)需要單獨(dú)說(shuō)明的屬性：名稱功能描述層編號(hào)為層指定一個(gè)名稱來(lái)標(biāo)識(shí)層。層的名稱只能包含英文字母和數(shù)字，不能使用特殊字符，并且不能以數(shù)字開(kāi)頭Z軸指定層的疊放順序，值較大的層位于較小的層之上，Z軸值可正可負(fù)，也可以為零可見(jiàn)性Default默認(rèn)，不指定可見(jiàn)性屬性。當(dāng)未指定可見(jiàn)性時(shí)，大多數(shù)瀏覽器都會(huì)默認(rèn)為繼承Inherit繼承，使用該層父級(jí)的可見(jiàn)性屬性Visible可見(jiàn)，顯示該層的內(nèi)容，而不管父級(jí)的值是什么Hidden隱藏，隱藏層的內(nèi)容，而不管父級(jí)的值是什么類(lèi)可將CSS規(guī)則定義應(yīng)用于對(duì)象溢出可見(jiàn)擴(kuò)展層的大小，時(shí)溢出的部分也可以顯示，層將向右下方擴(kuò)展隱藏保持層的大小，并剪切去與層大小不符的內(nèi)容，不顯示滾動(dòng)條滾動(dòng)條給層添加滾動(dòng)條，不管內(nèi)容是否超出層的大小。特別是通過(guò)提供滾動(dòng)條來(lái)避免在動(dòng)態(tài)環(huán)境中顯示和不顯示滾動(dòng)條導(dǎo)致的混亂自動(dòng)在層的內(nèi)容超過(guò)邊界時(shí)自動(dòng)顯示滾動(dòng)條剪輯定義層的可視區(qū)域，在左、右、上、下文本框中分別輸入一個(gè)值來(lái)指定距層邊界的距離層（APDiv）的其他操作技巧技巧1：同時(shí)修改多個(gè)層的屬性。按下Shift鍵，然后在頁(yè)面中單擊要選擇的層，或者在層面板中單擊要選擇的層，即可選中多個(gè)層。同時(shí)屬性面板將顯示這幾個(gè)層的屬性交集，在屬性面板中所作的任何修改，都會(huì)作用于所選中的層。技巧2：對(duì)齊多個(gè)層。使用層對(duì)齊命令即菜單命令：[修改-排列順序]，選擇一種對(duì)齊方式即可。該操作可以將一個(gè)或多個(gè)層與最后選定的層邊界對(duì)齊。在對(duì)齊層時(shí)，沒(méi)有選中的子層因?yàn)橐３峙c父層的相對(duì)位置而隨著移動(dòng)。技巧3：巧用網(wǎng)格線。菜單命令：[查看-網(wǎng)格-顯示網(wǎng)格]，使用對(duì)齊功能，則在移動(dòng)層或者調(diào)整層的大小時(shí)，層會(huì)自動(dòng)定位在最近的網(wǎng)格位置。菜單命令：[查看-網(wǎng)格-靠齊到網(wǎng)格]命令，勾選，此時(shí)選定并拖動(dòng)一個(gè)層，釋放鼠標(biāo)后，如果層與網(wǎng)格靠得很近，則會(huì)自動(dòng)跳至最近的網(wǎng)格位置與之對(duì)齊，“網(wǎng)格設(shè)置”對(duì)話框中的選項(xiàng)及選項(xiàng)作用選項(xiàng)作用顏色指定網(wǎng)格格線的顏色顯示網(wǎng)格設(shè)置網(wǎng)格的可見(jiàn)性，其功能與執(zhí)行：查看——網(wǎng)格——顯示網(wǎng)格靠齊到網(wǎng)格用于打開(kāi)或關(guān)閉對(duì)齊功能。其功能與執(zhí)行：查看——網(wǎng)格——靠齊到網(wǎng)格命令相同間隔設(shè)置網(wǎng)格線之間的距離。輸入一個(gè)數(shù)字，然后在其后的下拉列表中選擇像素、英寸或厘米作為單位顯示指定網(wǎng)格的顯示形式是實(shí)線還是虛線技巧4:層與表格之間的轉(zhuǎn)換。可以用層快速設(shè)計(jì)一個(gè)頁(yè)面，在將層轉(zhuǎn)換為表格，以適合不支持層的瀏覽器；還可以通過(guò)對(duì)層與表格的相互轉(zhuǎn)換優(yōu)化頁(yè)面設(shè)計(jì)。菜單命令：[修改-轉(zhuǎn)換-將APDiv到表格/或者將表格轉(zhuǎn)到APDiv]“轉(zhuǎn)換層為表格”對(duì)話框中的選項(xiàng)及作用選項(xiàng)作用表格布局最精確為每個(gè)層創(chuàng)建一個(gè)單元格，并附加保留層之間的空間所需的任何單元格最小：合并空白單元指定如果層定位在指定數(shù)目的像素內(nèi)，則層的邊緣應(yīng)對(duì)齊。如果選擇此選項(xiàng)，表中將包含較少的空行和空列，但可能不與布局精確匹配使用透明GIF用透明的GIF填充表的最后一行。這將確保該表在所有瀏覽器中以相同的列寬顯示。當(dāng)啟用該選項(xiàng)后，不能通過(guò)拖動(dòng)表列來(lái)編輯結(jié)果表。當(dāng)禁用該選項(xiàng)后，表中將不包含透明GIF，但是不同的瀏覽器中可能會(huì)具有不同的列寬置于頁(yè)面中央將表放置在頁(yè)面的中央布局工具防止層重疊可以防止層重疊顯示層面板轉(zhuǎn)換完成后顯示層面板顯示網(wǎng)格在轉(zhuǎn)換完成后顯示網(wǎng)格靠齊到網(wǎng)格啟用吸附到網(wǎng)格行為行為是被用來(lái)動(dòng)態(tài)響應(yīng)用戶操作、改變當(dāng)前頁(yè)面效果或是執(zhí)行特定任務(wù)的一種方法。使用行為可以使訪問(wèn)者與網(wǎng)頁(yè)之間產(chǎn)生一種交互，來(lái)改變頁(yè)面或者觸發(fā)任務(wù)。行為事實(shí)上是由預(yù)先編寫(xiě)好的JavaScript代碼構(gòu)成。一個(gè)行為是由一個(gè)事件和一個(gè)動(dòng)作構(gòu)成。任何一個(gè)動(dòng)作都需要一個(gè)事件激活，兩者相鋪相成。行為有3個(gè)重要部分：對(duì)象、事件和動(dòng)作。對(duì)象是產(chǎn)生行為的主體，許多網(wǎng)頁(yè)元素都可以成為對(duì)象，如圖片、文字、多媒體文件等。事件是觸發(fā)動(dòng)態(tài)效果的條件，它可以被添加到各種頁(yè)面元素上，也可以被添加到HTML標(biāo)簽中。不同的瀏覽器支持的事件種類(lèi)和數(shù)量不一樣，通常高版本瀏覽器支持更多的事件。行為通過(guò)動(dòng)作來(lái)完成動(dòng)態(tài)效果，動(dòng)作是一段JavaScript代碼，在Dreamweaver中使用內(nèi)置的行為，系統(tǒng)會(huì)自動(dòng)向頁(yè)面中添加JavaScript。Dreamweaver8內(nèi)置了很多行為動(dòng)作，形成一個(gè)JavaScript程序庫(kù)。除此之外用戶還可以到Macromedia官方網(wǎng)站下載并安裝更多的行為。如果用戶熟悉JavaScript語(yǔ)言，也可以設(shè)計(jì)自己的行為，添加到Dreamweaver8中。添加行為的準(zhǔn)備工作打開(kāi)行為面板，便于做進(jìn)一步的設(shè)置。菜單命令：[窗口-行為]，或者組合鍵Shift+F4.選擇添加行為的對(duì)象，為其在行為面板中添加行為，并設(shè)置合理的事件。關(guān)于添加行為的說(shuō)明在添加行為時(shí)，僅在操作的對(duì)象有效時(shí)才能選擇其適應(yīng)的行為，而有效行為在面板中顯示黑色；灰色的部分則意味行為無(wú)效。一個(gè)對(duì)象可以通過(guò)行為面板中的“獲取更多行為”，獲得在線提供的行為；也可以通過(guò)“調(diào)用Javascript”來(lái)添加外部已經(jīng)編寫(xiě)的行為。編輯行為時(shí)，選擇一個(gè)添加了行為的對(duì)象，如果要改變動(dòng)作參數(shù)，可以選中該行為，然后單擊右鍵，在彈出菜單中重新進(jìn)行編輯。如果要修改動(dòng)作的事件，可以在事件列表中單擊該事件，然后在下拉事件列表中進(jìn)行選擇。應(yīng)用行為在網(wǎng)頁(yè)中適當(dāng)?shù)靥砑有袨椋梢云鸬絼?dòng)態(tài)效果并使用戶與網(wǎng)頁(yè)之間具有交互性。交換圖像行為說(shuō)明：交換圖像行為既可以將一個(gè)圖像與另一個(gè)圖像進(jìn)行交換，也可以交換多個(gè)圖像。操作要點(diǎn)：1）使用交換圖像行為之前，應(yīng)先插入一個(gè)圖像并且將其選中作為行為的對(duì)象。2）交換時(shí)應(yīng)換入與原圖像具有相同高度和寬度大小的圖像，以使其適應(yīng)初始化圖像的大小。演示視頻：打開(kāi)瀏覽器窗口行為說(shuō)明：使用打開(kāi)瀏覽器窗口動(dòng)作可以使得單擊某個(gè)鏈接時(shí)打開(kāi)一個(gè)新的窗口，用來(lái)顯示鏈接目標(biāo)文件，窗口大小、名稱和屬性由用戶設(shè)置。窗口屬性主要包括：導(dǎo)航工具欄、菜單條、地址工具條、滾動(dòng)條、狀態(tài)欄、調(diào)整大小手柄。操作要點(diǎn)：可以基于圖像或者文字，一般用于縮略圖模式瀏覽網(wǎng)頁(yè)時(shí)，同該該行為顯示縮略圖對(duì)應(yīng)圖片更為詳細(xì)的信息；也可以直接作用于頁(yè)面，但事件只能指定為“Onload”。（IE瀏覽器）演示視頻：彈出信息行為說(shuō)明：給網(wǎng)頁(yè)一個(gè)彈出信息窗口，予以提示。操作要點(diǎn)：一般用將該行為用于頁(yè)面，事件直接指定為“Onload”。演示視頻：改變屬性行為說(shuō)明：改變屬性動(dòng)作構(gòu)成的行為來(lái)動(dòng)態(tài)地改變某個(gè)對(duì)象的屬性，例如改變層的背景或者圖像的大小。一般來(lái)說(shuō)，這個(gè)行為能夠改變的屬性決定附加動(dòng)作的對(duì)象和瀏覽器的類(lèi)型?？梢允褂迷撔袨樾薷膶傩缘膶?duì)象有層、圖像、表單以及表單中的各元素。操作要點(diǎn)：演示視頻：設(shè)置文本行為說(shuō)明：設(shè)置文本行為包括4種：設(shè)置層文本，以指定內(nèi)容替換某一頁(yè)上存在的層的內(nèi)容和格式，該內(nèi)容可以包括任何有效的HTML源代碼，但是保留層的屬性和顏色。還可以在文本框中嵌入任何有效的JavaScript函數(shù)調(diào)用、屬性、全局變量或其他的表達(dá)式。如果要嵌入JavaScript代碼，應(yīng)將其放置在大括號(hào)內(nèi)。如果要顯示大括號(hào)，在它前面加一個(gè)反斜杠即可。設(shè)置文本域文字設(shè)置框架文本設(shè)置狀態(tài)欄文本，行為可以設(shè)置瀏覽器窗口左下端狀態(tài)欄中顯示當(dāng)前狀態(tài)的提示信息。操作要點(diǎn)：前三種文本設(shè)置必須在一定的條件下，比如設(shè)置層文本時(shí)必須在[設(shè)計(jì)]窗口中創(chuàng)建層，而后一種可以在任何狀態(tài)下添加的行為。如果同時(shí)存在多個(gè)層，那么在[設(shè)置層文本]對(duì)話框的[層]下拉列表中選擇目標(biāo)層演示視頻：拖動(dòng)層行為說(shuō)明：如果在網(wǎng)頁(yè)中添加拖動(dòng)層動(dòng)作，首先在網(wǎng)頁(yè)中繪制層，并在層內(nèi)插入圖片或文字，然后點(diǎn)擊行為選擇拖動(dòng)層，完成對(duì)話框設(shè)置。操作要點(diǎn)：[基本]選項(xiàng)卡參數(shù)名稱及功能描述名稱功能描述層在下拉菜單中選擇要拖動(dòng)的層名稱移動(dòng)限制對(duì)滑動(dòng)控制或者可以移動(dòng)的布景，一般選擇該項(xiàng)，這樣可以將層的移動(dòng)限制在一定的區(qū)域內(nèi)不限制如果要設(shè)計(jì)拼圖或者拖動(dòng)、放下的游戲，可以選擇此項(xiàng)，表示不限制層的移動(dòng)范圍放下目標(biāo)在文本框中輸入數(shù)值，是相對(duì)于瀏覽器左上角的距離，用于確定該層的目的點(diǎn)坐標(biāo)靠齊距離輸入一個(gè)值，只有當(dāng)層被拖動(dòng)到目的點(diǎn)距離小于此數(shù)值時(shí)，層才會(huì)被認(rèn)為移動(dòng)到了目的點(diǎn)并且自動(dòng)拖放到指定目的點(diǎn)上去拖動(dòng)層高級(jí)選項(xiàng)卡中參數(shù)名稱及功能描述名稱功能描述拖動(dòng)控制點(diǎn)整個(gè)層在層上的任意一點(diǎn)都可以拖動(dòng)層層內(nèi)區(qū)域在文本框中指定拖動(dòng)層中的某個(gè)區(qū)域，層才能被拖動(dòng)拖動(dòng)時(shí)將層移至最前在層拖動(dòng)時(shí)將層移動(dòng)到最前面，然后在其下拉菜單中選擇“留在最上方”表示拖動(dòng)后將層停留在最前方；或者選擇“恢復(fù)z軸”表示拖動(dòng)后返回到原來(lái)在棧中的層次呼叫JavaScript輸入JavaScript代碼或者是JavaScript函數(shù)名，當(dāng)層被拖動(dòng)時(shí)，這個(gè)函數(shù)和代碼會(huì)不斷地被重復(fù)執(zhí)行放下時(shí)輸入JavaScript代碼或者函數(shù)名稱。當(dāng)訪問(wèn)者松開(kāi)鼠標(biāo)時(shí)，就會(huì)執(zhí)行這個(gè)方框中所指明的JavaScript代碼或者函數(shù)只有在靠齊時(shí)選中該復(fù)選框，只有當(dāng)層放下并且到達(dá)指定的位置后才執(zhí)行該行為中的JavaScript代碼和函數(shù)演示視頻：顯示-隱藏層行為說(shuō)明：顯示-隱藏層利用頁(yè)面上的各種事件顯示、隱藏或者恢復(fù)層原本的可見(jiàn)性屬性，還可以控制多個(gè)層的顯示。該行為命令常常被用來(lái)顯示提示信息，操作要點(diǎn)：產(chǎn)生該行為的層初始狀態(tài)需設(shè)為隱藏，再設(shè)置觸發(fā)行為的事件，其中要注意設(shè)置一個(gè)事件觸發(fā)顯示行為，也要同樣設(shè)置一個(gè)事件觸發(fā)隱藏行為。演示視頻：應(yīng)用時(shí)間軸行為說(shuō)明：應(yīng)用時(shí)間軸可以在不同的時(shí)間部位放置不同的內(nèi)容或者添加相應(yīng)的行為，就可以讓對(duì)應(yīng)的時(shí)間發(fā)生對(duì)應(yīng)事件。操作要點(diǎn)：時(shí)間軸的修改（延長(zhǎng)動(dòng)畫(huà)時(shí)間、改變關(guān)鍵幀速度、添加或刪除幀、改變動(dòng)畫(huà)路徑、調(diào)整播放模式）演示視頻：HTMLHTMLHTML指的是超文本標(biāo)記語(yǔ)言(HyperTextMarkupLanguage)HTML不是一種編程語(yǔ)言，而是一種標(biāo)記語(yǔ)言(markuplanguage)標(biāo)記語(yǔ)言是一套標(biāo)記標(biāo)簽(markuptag)HTML使用標(biāo)記標(biāo)簽來(lái)描述網(wǎng)頁(yè)HTML標(biāo)簽（HTMLtag）HTML標(biāo)簽是由尖括號(hào)包圍的關(guān)鍵詞，比如<html>HTML標(biāo)簽通常是成對(duì)出現(xiàn)的，比如<b>和</b>標(biāo)簽對(duì)中的第一個(gè)標(biāo)簽是開(kāi)始標(biāo)簽，第二個(gè)標(biāo)簽是結(jié)束標(biāo)簽，開(kāi)始和結(jié)束標(biāo)簽也被稱為開(kāi)放標(biāo)簽和閉合標(biāo)簽HTML文檔=網(wǎng)頁(yè)HTML文檔描述網(wǎng)頁(yè)HTML文檔包含HTML標(biāo)簽和純文本HTML文檔也被稱為網(wǎng)頁(yè)整個(gè)頁(yè)面由〈html〉標(biāo)注，頁(yè)面又分文檔頭和文檔體，分別對(duì)應(yīng)標(biāo)簽<head>和<body>標(biāo)注。HTML元素HTML元素以開(kāi)始標(biāo)簽起始<標(biāo)簽>HTML元素以結(jié)束標(biāo)簽終止</標(biāo)簽>元素的內(nèi)容是開(kāi)始標(biāo)簽與結(jié)束標(biāo)簽之間的內(nèi)容某些HTML元素具有空內(nèi)容（emptycontent）空標(biāo)簽在開(kāi)始標(biāo)簽中進(jìn)行關(guān)閉（以開(kāi)始標(biāo)簽的結(jié)束而結(jié)束，如li）大多數(shù)HTML元素可擁有屬性大多數(shù)HTML元素可以嵌套（可以包含其他HTML元素）。DIVDIV元素是用于分組HTML元素的塊級(jí)元素，常與CSS設(shè)置共同用于網(wǎng)頁(yè)布局設(shè)計(jì)。DIV可定義文檔中的分區(qū)或節(jié)（division/section），該標(biāo)簽可以把文檔分割為獨(dú)立的、不同的部分，也意味著它的內(nèi)容自動(dòng)地開(kāi)始一個(gè)新行。它可以用作嚴(yán)格的組織工具，并且不使用任何格式與其關(guān)聯(lián)。如果用id或class來(lái)標(biāo)記<div>，那么該標(biāo)簽的作用會(huì)變得更加有效。創(chuàng)建Div及其屬性設(shè)置的視頻演示創(chuàng)建DIV的命令插入工具欄：[布局-插入div標(biāo)簽]或者菜單命令：[插入記錄-布局對(duì)象-div標(biāo)簽]或者代碼視圖：直接輸入<div>并做進(jìn)一步設(shè)置完成上述命令后，通過(guò)<div>的class或id應(yīng)用額外的樣式。DIV的重要說(shuō)明不必為每一個(gè)<div>都加上類(lèi)或id，雖然這樣做也有一定的好處。可以對(duì)同一個(gè)<div>元素應(yīng)用class或id屬性，但是更常見(jiàn)的情況是只應(yīng)用其中一種。這兩者的主要差異是，class用于元素組（類(lèi)似的元素，或者可以理解為某一類(lèi)元素），而id用于標(biāo)識(shí)單獨(dú)的唯一的元素。<div>是一個(gè)塊級(jí)元素，也就是說(shuō)，瀏覽器通常會(huì)在div元素前后放置一個(gè)換行符。最好使用<div>元素來(lái)組合塊級(jí)元素，這樣就可以使用樣式對(duì)它們進(jìn)行格式化。Div標(biāo)簽及說(shuō)明可選屬性值描述\o"HTML<div>標(biāo)簽的align屬性"alignleftrightcenterjustify不贊成使用。請(qǐng)使用樣式取而代之。規(guī)定div元素中的內(nèi)容的對(duì)齊方式。全局屬性：<div>標(biāo)簽支持HTML中的全局屬性。CSSCSS即為級(jí)聯(lián)樣式表或?qū)盈B樣式表，通常用名字或者HTML標(biāo)簽表示，在HTML文檔中的CSS樣式表可以控制大多數(shù)傳統(tǒng)的文本格式，比如字體、字號(hào)以及對(duì)齊方式，還可以指定特殊的HTML屬性，例如定位、表格樣式和特殊效果等。把樣式添加到HTML4.0中，解決了內(nèi)容與表現(xiàn)分離的問(wèn)題，使得網(wǎng)頁(yè)更新效率更高；同時(shí)多個(gè)樣式定義可層疊。創(chuàng)建CSS及其屬性設(shè)置的視頻演示創(chuàng)建標(biāo)簽的CSS視頻演示：創(chuàng)建類(lèi)的CSS視頻演示：創(chuàng)建高級(jí)CSS的視頻演示：創(chuàng)建行內(nèi)樣式表的視頻演示：創(chuàng)建外部CSS樣式表的視頻演示：文字應(yīng)用CSS的演示:圖片應(yīng)用CSS的演示：表格應(yīng)用CSS的演示：創(chuàng)建CSS的命令菜單命令：[窗口-CSS樣式]，在CSS樣式面板中新建CSS或者代碼視圖：直接編寫(xiě)CSS代碼CSS的重要說(shuō)明樣式通常存儲(chǔ)在樣式表中，分為行內(nèi)樣式表、內(nèi)部樣式表、外部樣式表。行內(nèi)樣式表：樣式可以規(guī)定在單個(gè)的HTML元素中，即形如標(biāo)簽<style=”屬性.屬性值；屬性.屬性值”>內(nèi)部樣式表：在HTML頁(yè)的頭元素中，即在<head></head>之間，被<!-->的html注釋外部樣式表：在一個(gè)外部的CSS文件中，即通過(guò)定義擴(kuò)展名為.CSS的文件，使之應(yīng)用到多個(gè)頁(yè)面文檔；可以在同一個(gè)HTML文檔內(nèi)部引用多個(gè)外部樣式表。外部樣式表可以極大提高工作效率，可同時(shí)改變站點(diǎn)中所有頁(yè)面的布局和外觀。CSS的分類(lèi)：標(biāo)簽選擇器：標(biāo)簽定義，全局性（形式：標(biāo)簽）類(lèi)選擇器：自定義選族，局部（形式：.名稱）ID選擇器：ID選擇，根據(jù)ID應(yīng)用（形式：#ID）其中，類(lèi)選擇器的名稱不要與系統(tǒng)標(biāo)簽同名。定義形式CSS選擇器+{聲明；}CSS選擇器{聲明；}其中，聲明格式：屬性:屬性值;CSS濾鏡Alpha濾鏡語(yǔ)法：Alpha(Opacity=?,FinishOpacity=?,Style=?,StartX=?,StartY=?,FinishX=?,FinishY=?)參數(shù)和功能：使對(duì)象產(chǎn)生透明度。Blur濾鏡語(yǔ)法：Blur(Add=?,Direction=?,Strength=?)參數(shù)和功能：使對(duì)象產(chǎn)生模糊效果。Chroma濾鏡語(yǔ)法：Chroma(Color=?)參數(shù)和功能：某個(gè)顏色變透明。這個(gè)功能對(duì)圖片的支持不是很好。Dropshadow濾鏡語(yǔ)法：DropShadow(Color=?,OffX=?,OffY=?,Positive=?)參數(shù)和功能：陰影效果。這個(gè)功能對(duì)圖片的支持不是很好，普遍用于文字。FlipH、FlipV濾鏡無(wú)任何參數(shù)。FlipH使對(duì)象產(chǎn)生水平翻轉(zhuǎn)效果；FlipV使對(duì)象產(chǎn)生垂直翻轉(zhuǎn)效果。Glow濾鏡語(yǔ)法：Glow(Color=?,Strength=?)參數(shù)和功能：使對(duì)象的外輪廓產(chǎn)生一種光暈效果。一般用于文字效果。Gray濾鏡無(wú)任何參數(shù)。使圖片由彩色變?yōu)榛野咨{(diào)。Invert濾鏡無(wú)任何參數(shù)。使圖片產(chǎn)生照片底片的效果。Light濾鏡語(yǔ)法：Light(?)參數(shù)和功能：模擬光源的投射效果。不過(guò)要通過(guò)調(diào)用方法來(lái)實(shí)現(xiàn)，這就需要用到Javascript動(dòng)態(tài)濾鏡編程。在這里就不細(xì)說(shuō)了。Mask濾鏡語(yǔ)法：Mask(Color=?)參數(shù)和功能：在對(duì)象上建立一個(gè)覆蓋于表面的膜。對(duì)圖像的支持不好，普遍用于文字。Shawdow濾鏡語(yǔ)法：Shadow(Color=?,Direction=?)參數(shù)和功能：與dropshadow非常相似，也是一種陰影效果。dropshadow沒(méi)有漸進(jìn)感，shadow有漸進(jìn)的陰影感。X-ray濾鏡無(wú)任何參數(shù)。使圖片只顯示其輪廓。Wave濾鏡語(yǔ)法：Wave(Add=?,Freq=?,LightStrength=?,Phase=?,Strength=?)參數(shù)和功能：使對(duì)象在垂直方向上產(chǎn)生波浪的變形效果。除了這些之外，css還包含兩種動(dòng)態(tài)濾鏡，BlendTrans混合轉(zhuǎn)換濾鏡和Revealtrans顯示轉(zhuǎn)換濾鏡。這兩類(lèi)濾鏡不能單獨(dú)在html中調(diào)用，必須要結(jié)合在scripts程序中，由spripts程序?qū)ζ溥M(jìn)行控制。DIV+CSS綜合典型案例CSS布局與table表格式布局是兩種完全不同的布局方式。DIV是XHTML中指定的，專(zhuān)門(mén)用于布局設(shè)計(jì)的容器對(duì)象。在CSS不布局中，Div則是這種布局方式的核心對(duì)象。使用CSS布局則完全不同，設(shè)計(jì)者首先考慮的不是如何分割網(wǎng)頁(yè)，而是從網(wǎng)頁(yè)內(nèi)容的邏輯關(guān)系出發(fā)，區(qū)分出內(nèi)容的層次的重點(diǎn)。然后根據(jù)邏輯關(guān)系，把網(wǎng)頁(yè)的內(nèi)容使用<div>或其他的HTML標(biāo)記組織好，再考慮網(wǎng)頁(yè)的形式如何與內(nèi)容相適應(yīng)。下面簡(jiǎn)單介紹幾種常見(jiàn)的網(wǎng)頁(yè)布局形式。Div標(biāo)簽作為頁(yè)面元素的主要容器，可容納所有子Div標(biāo)簽、圖像和文字等內(nèi)容，并根據(jù)具體需要對(duì)各子Div標(biāo)簽和對(duì)象進(jìn)行格式化。設(shè)計(jì)者要能靈活掌握Div+CSS準(zhǔn)確定位頁(yè)面元素的排版技術(shù)，創(chuàng)建布局合理、美觀的網(wǎng)頁(yè)。通常用Div標(biāo)簽來(lái)定義網(wǎng)頁(yè)上的一個(gè)特定的區(qū)域，將文字、圖片和表格等網(wǎng)頁(yè)元素放到此區(qū)域中，再用CSS對(duì)該Div標(biāo)簽定義的區(qū)域進(jìn)行定位和樣式的設(shè)置。CSS樣式表不僅是定義頁(yè)面樣式的最佳工具，同時(shí)也具有精確地定位獨(dú)享的控制能力，因此，它成為不可多得的網(wǎng)頁(yè)布局工具。為了提高設(shè)計(jì)效率，可以事先定義好布局所需的CSS樣式規(guī)則，然后在“插入Div標(biāo)簽”對(duì)話框中應(yīng)用。使用這種方法排版的網(wǎng)頁(yè)中的代碼簡(jiǎn)潔且更新方便，更能兼容更多的瀏覽器。典型案例

其他網(wǎng)頁(yè)元素音頻音效在網(wǎng)頁(yè)動(dòng)畫(huà)中有畫(huà)龍點(diǎn)睛的作用，使網(wǎng)頁(yè)給訪問(wèn)者留下深刻的印象。Dreamweaver提供了多種在網(wǎng)頁(yè)中插入聲音的方法，比如之間插入法和代碼法等。網(wǎng)頁(yè)中常用的音頻格式比較多，通常使用的主要有MP3、WMA、RM、MID以及AIF等格式的音頻。其中MID文件一般只用來(lái)做網(wǎng)頁(yè)的背景音樂(lè)。下表描述了一些常見(jiàn)的聲音文件格式以及每種聲音格式用于Web設(shè)計(jì)時(shí)的優(yōu)點(diǎn)和缺點(diǎn)。音頻格式用于網(wǎng)頁(yè)設(shè)計(jì)時(shí)的優(yōu)缺點(diǎn).midi或.mid(電子樂(lè)器化數(shù)據(jù)接口)主要用于電子樂(lè)器音樂(lè)。很多瀏覽器不用插件也可以支持MIDI文件。雖然其聲音品質(zhì)非常好，但同時(shí)也取決于來(lái)訪者聲卡的好壞。一個(gè)非常小的MIDI文件也可以提供相當(dāng)長(zhǎng)的聲音剪輯。MIDI文件不能錄制，必須在計(jì)算機(jī)上使用特殊的硬件和軟件進(jìn)行人工合成。.wav(波形擴(kuò)展)該文件有好的聲音品質(zhì)，很多瀏覽器不用插件也可以支持WAV文件。也可以從CD、磁帶、麥克風(fēng)等輸入設(shè)備錄制自己的WAV文件。然后其龐大的文件尺度限制了在Web頁(yè)上使用聲音剪輯的長(zhǎng)度。.aif(聲音交換文件格式，或AIFF)和WAV格式一樣，它也有非常好的聲音品質(zhì)，很多瀏覽器不用插件也可以支持AIF文件。也可以從CD、磁帶、麥克風(fēng)等輸入設(shè)備錄制自己的AIF文件。然后其龐大的文件尺寸限制了在Web頁(yè)上使用聲音剪輯的長(zhǎng)度.mp3(電影莊家組聲音，或者M(jìn)PEGAudioLayer-3)一種聲音文件大小有實(shí)質(zhì)性縮小壓縮格式。其聲音品質(zhì)非常好。如果正確錄制和壓縮MP3文件，其聲音品質(zhì)可以和CD媲美，新技術(shù)可以將文件“流式化”，這樣來(lái)訪者就無(wú)須等待下載并安裝一個(gè)輔助應(yīng)用程序或者插件，比如QuickTime、WindonwsMediaPlayer或者RealPlayer。.ra、.ram、.rpm或RealAudio有非常搞的壓縮比，所以比MP3文件還要小。完整的歌曲文件可以在較短的時(shí)間內(nèi)完成下載。由于該類(lèi)文件可以從一個(gè)普通的Web服務(wù)器上“流式”播放，所以來(lái)訪者可以在文件還沒(méi)完全下載之前變開(kāi)始欣賞音樂(lè)。這類(lèi)文件音質(zhì)不如MP3，但是最新版本的播放器和解碼器已經(jīng)極大提高了聲音品質(zhì)。來(lái)訪者必須下載并安裝RealPlayer應(yīng)用程序或者輔助插件來(lái)播放這些文件。命令操作：代碼輸入法背景音樂(lè)是在瀏覽網(wǎng)頁(yè)時(shí)聽(tīng)到的背景聲音，它一般不需要控制，播放的方式為循環(huán)播放。<BGSOUND>標(biāo)簽添加到網(wǎng)頁(yè)文件的><head><head>之間，設(shè)置好背景音樂(lè)的路徑就可以了。行為插入法在Dreamweaver中，還有最直接的方法在網(wǎng)頁(yè)中插入音樂(lè)，利用這種方法既可以將其設(shè)置為網(wǎng)頁(yè)背景音樂(lè)，還可以將其設(shè)置為在線音樂(lè)，這種方法就是利用Dreamweaver中[行為]面板中的[播放聲音]命令。但高版本Dreamweaver已經(jīng)不建議使用該方法。插入音頻演示視頻越來(lái)越多的網(wǎng)站為了吸引瀏覽者的目光，在網(wǎng)站中添加了視頻，例如商業(yè)網(wǎng)站將其產(chǎn)品介紹制作成視頻放在網(wǎng)站中，或者將公司的新聞拍攝成視頻放置在網(wǎng)站中，而很多音樂(lè)也是通過(guò)網(wǎng)絡(luò)中的MTV視頻傳播流行的。在Dreamwaver中可以通過(guò)不同的方式插入不同格式的視頻，比如輸入一段代碼，或者利用Active控件、Shockwave影片以及FlashVideo等。插入ActiveXActiveX技術(shù)的前身是OLE技術(shù)，但是只是為了發(fā)展一種小型的可以從網(wǎng)絡(luò)上快速下載的可重用組件。在網(wǎng)頁(yè)中添加一些不同功能的ActiveX控件，就可以播放視頻、顯示試算表內(nèi)容等，只要瀏覽者的瀏覽器支持ActiveX控件的功能，就會(huì)自動(dòng)下載并且執(zhí)行它。Dreamweaver中的ActiveX對(duì)象允許用戶在網(wǎng)頁(yè)訪問(wèn)者的瀏覽器中為ActiveX控件設(shè)置屬性和參數(shù)。Dreamweaver使用Object標(biāo)簽來(lái)標(biāo)識(shí)網(wǎng)頁(yè)中ActiveX控件出現(xiàn)的位置，并且為該ActiveX控件提供參數(shù)。插入工具欄：[常用-ActiveX]插入ShockwaveShockwave影片是Macromedia網(wǎng)上交互多媒體的標(biāo)準(zhǔn)，是一種允許用Macromedia的Director軟件創(chuàng)建的媒體文件，能夠快速下載并能被大多數(shù)瀏覽器播放的壓縮格式。播放Shockwave影片的軟件創(chuàng)建的媒體文件，能夠快速下載并能被大多數(shù)瀏覽器播放的壓縮格式。播放Shockwave影片的軟件既可以作為NetscapeNavigator插件，也可以作為ActiveX控件。當(dāng)插入一個(gè)Shockwave影片時(shí)，Dreamweaver將同時(shí)使用object標(biāo)簽和enbed標(biāo)簽，以便在所有的瀏覽器類(lèi)型中都獲得最佳效果。當(dāng)在[屬性]面板中修改影片時(shí)，Dreamweaver將同時(shí)對(duì)object標(biāo)簽和enbed標(biāo)簽中的參數(shù)作適當(dāng)?shù)男薷?。插入工具欄：[常用-Shockwave]插入FlashVideoFLV流媒體格式是一種新的視頻格式，全稱為FlashVideo。從FlashMX2004開(kāi)始就對(duì)其提供了完美的支持，它的出現(xiàn)有效地解決了視頻文件導(dǎo)入Flash后，使導(dǎo)出的SWF文件體積龐大，不能在網(wǎng)絡(luò)上很好地使用等缺點(diǎn)。插入工具欄：[常用-FlashVideo]插入視頻演示Flash文本在Dreamweaver中可以創(chuàng)建只包含文本的Flash文件，這樣就可以使用自己設(shè)計(jì)器的字體和文本創(chuàng)建較小的矢量圖形影片。在創(chuàng)建文本超鏈接時(shí)，不管之前怎樣設(shè)置文本的顏色屬性，在添加鏈接后，文本都會(huì)變成統(tǒng)一的顏色。Flash文本就不會(huì)發(fā)送這種情況，并且還可以創(chuàng)建鼠標(biāo)經(jīng)過(guò)效果。插入工具欄：[常用-Flash文本]或者菜單命令：[插入記錄-媒體-Flash文本]關(guān)鍵參數(shù)：wmode，值：transparent，作用：使得Flash背景透明注意：1）要想在Dreamweaver中創(chuàng)建Flash文本，必須新建一個(gè)文檔并且將其保存。2）保存的Flash文件名不能包含中文。插入Flash文本視頻演示Flash按鈕利用Flash按鈕對(duì)象，用戶可以定制和插入一個(gè)以及設(shè)計(jì)好的Flash按鈕，即使不會(huì)使用Flash軟件的用戶也可以在Dreamweaver中直接插入Flash動(dòng)畫(huà)格式的按鈕?，F(xiàn)在只需輸入文字就可以了，而且要比傳統(tǒng)的點(diǎn)陣圖文字或者按鈕文件更小，效果更漂亮。插入工具欄：[常用-Flash按鈕]或者菜單命令：[插入記錄-媒體-Flash按鈕]關(guān)鍵參數(shù)：wmode，值：transparent，作用：使得Flash背景透明注意事項(xiàng)與創(chuàng)建ash文本一樣。插入Flash按鈕視頻演示Flash動(dòng)畫(huà)雖然在Dreamweaver中可以直接插入Flash文本和Flash按鈕，但是如果想要插入帶有動(dòng)畫(huà)效果的Flash,就需要利用外部軟件制作，然后在Dreamweaver中插入制作的Flash動(dòng)畫(huà)。插入工具欄：[常用-Flash]或者菜單命令：[插入記錄-媒體-Flash]關(guān)鍵參數(shù)：wmode，值：transparent，作用：使得Flash背景透明插入Flash視頻演示圖像查看器圖像查看器，將圖片以Flash效果呈現(xiàn)，可以通過(guò)點(diǎn)擊圖片進(jìn)入鏈接頁(yè)面詳細(xì)閱讀，是一種更為簡(jiǎn)單的、靈活的Flash動(dòng)畫(huà)效果。菜單命令：[插入記錄-媒體-圖像查看器]屬性描述bgColor設(shè)置圖片播放界面的背景顏色captionColor設(shè)置圖片的標(biāo)題顏色captionFont設(shè)置圖片的標(biāo)題字體captionSize設(shè)置圖片的標(biāo)題字體大小frameColor設(shè)置動(dòng)畫(huà)框架顏色frameShow設(shè)置是否顯示框架frameThickness框架的厚度imageCaptions圖片標(biāo)題imageLinks圖片鏈接地址imageLindTarget窗口打開(kāi)方式imageURLs制作的圖片瀏覽器內(nèi)所含有圖片的來(lái)源位置showControls是否顯示控制條titleColor播放器的標(biāo)題顏色titleFont播放器的標(biāo)題字體titleSize播放器的標(biāo)題字體尺寸transitionsType圖片之間的過(guò)度效果插入圖像查看器視頻演示創(chuàng)建表單表單是網(wǎng)頁(yè)與瀏覽者的一種交互界面。表單的目的是讓用戶輸入數(shù)據(jù)，這些數(shù)據(jù)傳送到頁(yè)面服務(wù)器供查詢或者登錄。有了表單后，才能夠輸入會(huì)員資料，提供站點(diǎn)反饋意見(jiàn)、調(diào)查報(bào)告等信息、從而使服務(wù)器端能夠處理表單輸入的數(shù)據(jù)。單純的表單網(wǎng)頁(yè)只是一個(gè)輸入數(shù)據(jù)的前端界面，也可以說(shuō)是服務(wù)器的窗口，實(shí)際的數(shù)據(jù)處理是在網(wǎng)頁(yè)服務(wù)器的相關(guān)程序和數(shù)據(jù)庫(kù)。使