- 相關(guān)推薦
dreamweaver入門(mén)基礎(chǔ)
我相信每個(gè)做網(wǎng)頁(yè)設(shè)計(jì)的都了解過(guò)DW吧。而DW其實(shí)非常適合新手，上手容易操作簡(jiǎn)單。就像ps一樣功能強(qiáng)大。所以對(duì)于小白來(lái)說(shuō)可能其強(qiáng)大的功能讓我們不知道如何去入門(mén)了。而下面小編就為大家分享下dreamweaver入門(mén)基礎(chǔ)吧。
dreamweaver入門(mén)(2004版本):功能簡(jiǎn)介：
Macromedia Dreamweaver MX 2004 (簡(jiǎn)稱(chēng)DW MX 2004)，是Macromedia 最新開(kāi)發(fā)的的HTML編輯器，用于對(duì)Web站點(diǎn)、Web頁(yè)和 Web應(yīng)用程序進(jìn)行設(shè)計(jì)、編碼和開(kāi)發(fā)。 DW MX 2004 包含有一個(gè)嶄新、簡(jiǎn)潔、高效的界面，且性能也得到了改進(jìn)。此外，還包含了眾多新增的功能，改善了軟件的易用性并使您無(wú)論處于設(shè)計(jì)環(huán)境還是編碼環(huán)境都可以方 便地生成頁(yè)面。
【DW MX 2004 MX 2004 的新功能簡(jiǎn)介】
▲簡(jiǎn)潔高效的設(shè)計(jì)和開(kāi)發(fā)界面：界面更易于使用，可使您的工作效率和工作質(zhì)量均得到提高。
▲“插入”欄的改進(jìn)：簡(jiǎn)潔高效的新外觀(guān)，占用更少的工作區(qū)空間。還新增加了一個(gè)“收藏”類(lèi)別，您可以對(duì)“插入”欄進(jìn)行自定義，將最常使用的對(duì)象放置在該欄上。
▲表格編輯可視化：在表格中進(jìn)行列調(diào)整操作時(shí)能看到實(shí)際效果。
▲用戶(hù)界面改進(jìn)：可得到最大的可用工作區(qū)，更清晰地顯示上下文和焦點(diǎn)，更易于使用和更具邏輯性。
▲起始頁(yè)：使您能夠訪(fǎng)問(wèn)最近使用過(guò)的文件，創(chuàng)建新文件和訪(fǎng)問(wèn)DW MX 2004資源。起始頁(yè)會(huì)在您啟動(dòng)DW MX 2004 或尚未打開(kāi)文檔時(shí)顯示。
▲保存桌面選項(xiàng)：使您可以選擇當(dāng)您重新啟動(dòng)DW MX 2004 時(shí)重新打開(kāi)您上一次使用的文檔。
▲完全支持 Unicode：DW MX 2004支持 Internet Explorer所支持的所有文本編碼方式。您可以使用幾乎所有您的系統(tǒng)中安裝的語(yǔ)言字體，DW MX 2004 會(huì)正確地顯示和保存這些字體。
▲安全 FTP：使您能夠完全加密所有文件傳輸。
▲新式的頁(yè)面布局和設(shè)計(jì)環(huán)境。
▲增強(qiáng)的 CSS 功能：提供了一個(gè)更為精巧的方法來(lái)進(jìn)行樣式設(shè)計(jì)及提高設(shè)計(jì)交互性。
▲動(dòng)態(tài)跨瀏覽器驗(yàn)證：在您保存文檔時(shí)自動(dòng)檢查當(dāng)前文檔的跨瀏覽器兼容性問(wèn)題。
本教程針對(duì)DW MX 2004簡(jiǎn)體中文版進(jìn)行討論，供學(xué)習(xí)網(wǎng)頁(yè)制作創(chuàng)建靜態(tài)網(wǎng)站的朋友們參考。因本人水平有限，不當(dāng)之處在所難免，歡迎批評(píng)指正。
【圖象處理軟件】
Photoshop：制作圖文并茂的網(wǎng)頁(yè)，需要處理圖片， PS 是最好的圖象處理軟件。最新版為Photoshop CS(俗稱(chēng)8.0)版本。對(duì)初學(xué)者來(lái)說(shuō)稍微專(zhuān)業(yè)了。您可以使用簡(jiǎn)單易學(xué)、功能強(qiáng)大的的 Photoshop Elements(即：PSE)，對(duì)于網(wǎng)頁(yè)圖片文件制作PSE就足夠用了。。
Fireworks：最新為 MX 2004版本，網(wǎng)頁(yè)制作三劍客之一。能和DW無(wú)縫鏈接。該軟件請(qǐng)您自行收集下載。
Flash： 最新為 MX 2004版本，網(wǎng)頁(yè)制作三劍客之一。網(wǎng)上最火的動(dòng)畫(huà)制作軟件。該軟件請(qǐng)您自行收集下載。
Ulead GIF Animator：友立公司開(kāi)發(fā)的功能強(qiáng)大的GIF動(dòng)畫(huà)軟件。該軟件請(qǐng)您自行收集下載。
【其他軟件】
CuteFTP：是專(zhuān)業(yè)的FTP上傳軟件，用于往服務(wù)器端上傳文件用。 Dreamweaver MX 2004 有此功能，而且功能強(qiáng)大。但是，不少人還是習(xí)慣用專(zhuān)業(yè)的FTP軟件。該軟件請(qǐng)您自行收集下載。
最終您還需要有一個(gè)網(wǎng)絡(luò)空間。以便您的大作讓更多的人瀏覽。
dreamweaver入門(mén)(2004版本):窗口布局：
窗口布局
Dreamweaver MX 2004 提供了將全部元素置于一個(gè)窗口中的集成工作區(qū)。在集成工作區(qū)中，全部窗口和面板集成在一個(gè)應(yīng)用程序窗口中。您可以選擇面向設(shè)計(jì)人員的布局或面向手工編碼人 員需求的布局。首次啟動(dòng) Dreamweaver 時(shí)，會(huì)出現(xiàn)一個(gè)工作區(qū)設(shè)置對(duì)話(huà)框(如下圖)：
您可以從中選擇一種工作區(qū)布局。如果您不熟悉編寫(xiě)代碼，請(qǐng)您選擇“設(shè)計(jì)者”。如果您以后想更改工作區(qū)，可以使用編輯菜單“首選參數(shù)”對(duì)話(huà)框切換到一種不同的工作區(qū)。編輯菜單“首選參數(shù)”對(duì)話(huà)框如下圖：
【欄目說(shuō)明】
“插入”欄(如下圖)：包含用于將各種類(lèi)型的“對(duì)象”(如圖像、表格和層)插入到文檔中的按鈕。每個(gè)對(duì)象都是一段 HTML 代碼，允許您在插入它時(shí)設(shè)置不同的屬性。例如，您可以通過(guò)單擊“插入”欄中的“表格”按鈕插入一個(gè)表格。也可以不使用“插入”欄而使用“插入”菜單插入對(duì) 象。
“文檔”窗口 顯示您當(dāng)前創(chuàng)建和編輯的文檔。
“屬性檢查器”(如下圖)： 用于查看和更改所選對(duì)象或文本的各種屬性。
“面板組”(如下圖) 是分組在某個(gè)標(biāo)題下面的相關(guān)面板的集合。若要展開(kāi)一個(gè)面板組，請(qǐng)單擊組名稱(chēng)左側(cè)的展開(kāi)箭頭;若要取消�？恳粋�(gè)面板組，請(qǐng)拖動(dòng)該組標(biāo)題條左邊緣的手柄。
“文件”面板(如下圖) 使您可以管理您的文件和文件夾，無(wú)論它們是 Dreamweaver 站點(diǎn)的一部分還是在遠(yuǎn)程服務(wù)器上�！拔募泵姘暹�使您可以訪(fǎng)問(wèn)本地磁盤(pán)上的全部文件，類(lèi)似于 Windows 資源管理器。
Dreamweaver MX 2004提供了多種此處未說(shuō)明的其他面板、檢查器和窗口。若要打開(kāi)其它面板，請(qǐng)使用“窗口”菜單。
dreamweaver入門(mén)(2004版本):菜單概述：
菜單概述
本節(jié)提供 Dreamweaver MX 2004中各菜單的簡(jiǎn)要說(shuō)明。下圖為菜單條：
以下分別敘述菜單選項(xiàng)：
文件菜單編輯菜單
“文件”菜單 包含“新建”、“打開(kāi)”、“保存”、“保存全部”，還包含各種其他命令，用于查看當(dāng)前文檔或?qū)Ξ?dāng)前文檔執(zhí)行操作，例如“在瀏覽器中預(yù)覽”和“打印代碼”。
“編輯”菜單 包含選擇和搜索命令，例如“選擇父標(biāo)簽”和“查找和替換”。“編輯”菜單還提供對(duì)DW菜單中“首選參數(shù)”的訪(fǎng)問(wèn)。
查看菜單插入菜單
“查看”菜單 使您可以看到文檔的各種視圖(例如“設(shè)計(jì)”視圖和“代碼”視圖)，并且可以顯示和隱藏不同類(lèi)型的頁(yè)面元素和 DW工具及工具欄。
“插入”菜單提供“插入”欄的替代項(xiàng)，用于將對(duì)象插入您的文檔。
修改菜單文本菜單
“修改”菜單 使您可以更改選定頁(yè)面元素或項(xiàng)的屬性。使用此菜單，您可以編輯標(biāo)簽屬性，更改表格和表格元素，并且為庫(kù)項(xiàng)和模板執(zhí)行不同的操作。
“文本”菜單使您可以輕松地設(shè)置文本的格式。
命令菜單站點(diǎn)菜單
“命令”菜單 提供對(duì)各種命令的訪(fǎng)問(wèn);包括一個(gè)根據(jù)您的格式首選參數(shù)設(shè)置代碼格式的命令、一個(gè)創(chuàng)建相冊(cè)的命令等。
“站點(diǎn)”菜單 提供用于管理站點(diǎn)以及上傳和下載文件的菜單項(xiàng)。
窗口菜單幫助菜單
“窗口”菜單 提供對(duì) DW中的所有面板、檢查器和窗口的訪(fǎng)問(wèn)。
“幫助”菜單 提供對(duì) Dreamweaver 文檔的訪(fǎng)問(wèn)，包括關(guān)于使用 Dreamweaver 以及創(chuàng)建 Dreamweaver 擴(kuò)展功能的幫助系統(tǒng)，還包括各種語(yǔ)言的參考材料。
除了菜單欄菜單外，Dreamweaver 還提供多種右鍵顯示上下文菜單，您可以利用它們方便地訪(fǎng)問(wèn)與當(dāng)前選擇或區(qū)域有關(guān)的有用命令。若要顯示上下文菜單，右擊窗口中的某一項(xiàng)。
dreamweaver入門(mén)(2004版本):常用工具欄：
“插入”欄“插入”欄包含用于創(chuàng)建和插入對(duì)象(如表格、層和圖像)的按鈕。當(dāng)鼠標(biāo)指針滾動(dòng)到一個(gè)按鈕上時(shí)，會(huì)出現(xiàn)一個(gè)工具提示，其中含有該按鈕的名稱(chēng)�！ ∧承╊�(lèi)別具有帶彈出菜單的按鈕。從彈出菜單中選擇一個(gè)選項(xiàng)時(shí)，該選項(xiàng)將成為該按鈕的默認(rèn)操作。例如，如果從“圖像”按鈕的彈出菜單中選擇“圖像 占位符”，下次單擊“圖像”按鈕時(shí)，Dreamweaver 會(huì)插入一個(gè)圖像占位符。每當(dāng)從彈出菜單中選擇一個(gè)新選項(xiàng)時(shí)，該按鈕的默認(rèn)操作都會(huì)改變。
“插入”欄按以下的類(lèi)別進(jìn)行組織：
“常用”類(lèi)別使您可以創(chuàng)建和插入最常用的對(duì)象，例如圖像和表格。
“布局”類(lèi)別使您可以插入表格、div 標(biāo)簽、層和框架。您還可以從三個(gè)表格視圖中進(jìn)行選擇：“標(biāo)準(zhǔn)”(默認(rèn))、“擴(kuò)展表格”和“布局”。當(dāng)選擇“布局”模式后，您可以使用 Dreamweaver 布局工具：“繪制布局單元格”和“繪制布局表格”。
“表單”類(lèi)別包含用于創(chuàng)建表單和插入表單元素的按鈕。
“文本”類(lèi)別使您可以插入各種文本格式設(shè)置標(biāo)簽和列表格式設(shè)置標(biāo)簽。
“HTML”類(lèi)別使您可以插入用于水平線(xiàn)、頭內(nèi)容、表格、框架和腳本的 HTML 標(biāo)簽。
“服務(wù)器代碼”類(lèi)別僅適用于使用特定服務(wù)器語(yǔ)言的頁(yè)面，這些類(lèi)別中的每一個(gè)都提供了服務(wù)器代碼對(duì)象，您可以將這些對(duì)象插入“代碼”視圖中。
“應(yīng)用程序”類(lèi)別使您可以插入動(dòng)態(tài)元素，例如記錄集、重復(fù)區(qū)域以及記錄插入和更新表單。
“Flash 元素”類(lèi)別使您可以插入 Flash 元素。
“收藏”類(lèi)別使您可以將“插入”欄中最常用的按鈕分組和組織到某一常用位置。
文檔工具欄
文檔工具欄中包含按鈕，這些按鈕使您可以在文檔的不同視圖間快速切換：“代碼”視圖、“設(shè)計(jì)”視圖、同時(shí)顯示“代碼”和“設(shè)計(jì)”視圖的拆分視圖。
工具欄中還包含一些與查看文檔、在本地和遠(yuǎn)程站點(diǎn)間傳輸文檔有關(guān)的常用命令和選項(xiàng)。 以下對(duì)選項(xiàng)進(jìn)行說(shuō)明：
顯示代碼視圖 僅在“文檔”窗口中顯示“代碼”視圖。
顯示代碼視圖和設(shè)計(jì)視圖 在“文檔”窗口的一部分中顯示“代碼”視圖，而在另一部分中顯示“設(shè)計(jì)”視圖。當(dāng)選擇了這種組合視圖時(shí)，“視圖選項(xiàng)”菜單中的“在頂部查看設(shè)計(jì)視圖”選項(xiàng)變?yōu)榭捎�。�?qǐng)使用該選項(xiàng)指定在“文檔”窗口的頂部顯示哪種視圖。
顯示設(shè)計(jì)視圖 僅在“文檔”窗口中顯示“設(shè)計(jì)”視圖。
標(biāo)題 允許您為文檔輸入一個(gè)標(biāo)題，它將顯示在瀏覽器的標(biāo)題欄中。如果文檔已經(jīng)有了一個(gè)標(biāo)題，則該標(biāo)題將顯示在該區(qū)域中。
沒(méi)有瀏覽器/檢查錯(cuò)誤 使您可以檢查跨瀏覽器兼容性。
文件管理 顯示“文件管理”彈出菜單。
在瀏覽器中預(yù)覽/調(diào)試 在瀏覽器中預(yù)覽或調(diào)試文檔。從彈出菜單中選擇一個(gè)瀏覽器。
刷新設(shè)計(jì)視圖 當(dāng)您在“代碼”視圖中進(jìn)行更改后刷新文檔的“設(shè)計(jì)”視圖。
視圖選項(xiàng) 允許您為“代碼”視圖和“設(shè)計(jì)”視圖設(shè)置選項(xiàng)。
狀態(tài)欄
狀態(tài)欄提供與您正創(chuàng)建的文檔有關(guān)的其它信息 標(biāo)簽選擇器 顯示環(huán)繞當(dāng)前選定內(nèi)容的標(biāo)簽的層次結(jié)構(gòu)。單擊該層次結(jié)構(gòu)中的任何標(biāo)簽以選擇該標(biāo)簽及其全部?jī)?nèi)容。比如：?jiǎn)螕?可以選擇文檔的整個(gè)正文。
窗口大小 彈出菜單(僅在“設(shè)計(jì)”視圖中可見(jiàn))用來(lái)將“文檔”窗口的大小調(diào)整到預(yù)定義或自定義的尺寸。
“窗口大小”彈出菜單的右側(cè)是頁(yè)面的文檔大小和估計(jì)下載時(shí)間。
dreamweaver入門(mén)(2004版本):定義站點(diǎn)：
設(shè)置站點(diǎn)
Web 站點(diǎn)是一組具有如相關(guān)主題、類(lèi)似的設(shè)計(jì)、鏈接文檔和資源。Dreamweaver MX 2004 是一個(gè)站點(diǎn)創(chuàng)建和管理工具，因此使用它不僅可以創(chuàng)建單獨(dú)的文檔，還可以創(chuàng)建完整的 Web 站點(diǎn)。創(chuàng)建 Web 站點(diǎn)的第一步是規(guī)劃。為了達(dá)到最佳效果，在創(chuàng)建任何 Web 站點(diǎn)頁(yè)面之前，應(yīng)對(duì)站點(diǎn)的結(jié)構(gòu)進(jìn)行設(shè)計(jì)和規(guī)劃。決定要?jiǎng)?chuàng)建多少頁(yè)，每頁(yè)上顯示什么內(nèi)容，頁(yè)面布局的外觀(guān)以及頁(yè)是如何互相連接起來(lái)的。
請(qǐng)執(zhí)行以下操作：
啟動(dòng) Dreamweaver MX 2004：
選擇“站點(diǎn)” >“管理站點(diǎn)”(即，從“站點(diǎn)”菜單選擇“管理站點(diǎn)”)。 出現(xiàn)“管理站點(diǎn)”對(duì)話(huà)框。
在“管理站點(diǎn)”對(duì)話(huà)框中，單擊“新建”，然后從彈出式菜單中選擇“站點(diǎn)”。 出現(xiàn)“站點(diǎn)定義”對(duì)話(huà)框。
如果對(duì)話(huà)框顯示的是“高級(jí)”選項(xiàng)卡，則單擊“基本”。 出現(xiàn)“站點(diǎn)定義向?qū)А钡牡谝粋�(gè)界面，要求您為站點(diǎn)輸入一個(gè)名稱(chēng)。
在文本框中，輸入一個(gè)名稱(chēng)以在 Dreamweaver MX 2004中標(biāo)識(shí)該站點(diǎn)。該名稱(chēng)可以是任何所需的名稱(chēng)。
單擊“下一步”。出現(xiàn)向?qū)У南乱粋�(gè)界面，詢(xún)問(wèn)您是否要使用服務(wù)器技術(shù)。
選擇“否”選項(xiàng)，指示目前該站點(diǎn)是一個(gè)靜態(tài)站點(diǎn)，沒(méi)有動(dòng)態(tài)頁(yè)。
單擊“下一步”。出現(xiàn)向?qū)У南乱粋�(gè)界面，詢(xún)問(wèn)您要如何使用您的文件。
選擇標(biāo)有“編輯我的計(jì)算機(jī)上的本地副本，完成后再上傳到服務(wù)器(推薦)”的選項(xiàng)。 在站點(diǎn)開(kāi)發(fā)過(guò)程中有多種處理文件的方式，初學(xué)網(wǎng)頁(yè)制作的朋友請(qǐng)選擇此選項(xiàng)。
單擊該文本框旁邊的文件夾圖標(biāo)。 隨即會(huì)出現(xiàn)“選擇站點(diǎn)的本地根文件夾”對(duì)話(huà)框。
單擊“下一步”， 出現(xiàn)向?qū)У南乱粋�(gè)界面，詢(xún)問(wèn)您如何連接到遠(yuǎn)程服務(wù)器。從彈出式菜單中選擇“無(wú)”。 您可以稍后設(shè)置有關(guān)遠(yuǎn)程站點(diǎn)的信息。目前，本地站點(diǎn)信息對(duì)于開(kāi)始創(chuàng)建網(wǎng)頁(yè)已經(jīng)足夠了。單擊“下一步”，該向?qū)У南乱粋�(gè)屏幕將出現(xiàn)，其中顯示您的設(shè)置概要。
單擊“完成”完成設(shè)置。 隨即出現(xiàn)“管理站點(diǎn)”對(duì)話(huà)框，顯示您的新站點(diǎn)。單擊“完成”關(guān)閉“管理站點(diǎn)”對(duì)話(huà)框。
現(xiàn)在，已經(jīng)為您的站點(diǎn)定義了一個(gè)本地根文件夾。下一步，可以編輯自己的網(wǎng)頁(yè)了。
dreamweaver入門(mén)(2004版本):創(chuàng)建頁(yè)面：
頁(yè)面編輯
本節(jié)介紹如何應(yīng)用Dreamweaver MX 2004創(chuàng)建自己的網(wǎng)頁(yè)。
從頭創(chuàng)建自己的頁(yè)面，可以使用 Dreamweaver MX 2004起始頁(yè)創(chuàng)建新頁(yè)，或者可以選擇“文件” >“新建”，彈出如下對(duì)話(huà)框：
從各種預(yù)先設(shè)計(jì)的頁(yè)面布局中選擇一種。比如：選擇“基本頁(yè)”HTML，點(diǎn)擊創(chuàng)建按鈕。Dreamweaver MX 2004即展開(kāi)工作區(qū)界面(一個(gè)空白頁(yè))：
您可以在這個(gè)空白頁(yè)添加表格和輸入文本進(jìn)行編輯。如果您要向頁(yè)面添加圖片或其它元素，應(yīng)先保存這個(gè)空白頁(yè)。選擇“文件”>“另存為”，在“另存為”對(duì)話(huà)框中，瀏覽到站點(diǎn)本地根文件夾下。填入文件名，保存退出。
dreamweaver基礎(chǔ)教程:頁(yè)面的總體設(shè)置：
我們已經(jīng)描繪了小屋的藍(lán)圖，從現(xiàn)在開(kāi)始，為我們的小屋添磚加瓦吧。打開(kāi)01.html，制作一個(gè)圖文混排的簡(jiǎn)單頁(yè)面。
一、頁(yè)面的總體設(shè)置
1、設(shè)置頁(yè)面的頭內(nèi)容
頭內(nèi)容再瀏覽器中是不可見(jiàn)的，但是卻攜帶著網(wǎng)頁(yè)的重要信息，如關(guān)鍵字、描述文字等，還可以實(shí)現(xiàn)一些非常重要的功能，如自動(dòng)刷新功能。
鼠標(biāo)左鍵單擊插入工具欄最左邊按鈕旁的下拉小三角，在彈出菜單中選擇“HTML”項(xiàng)，出現(xiàn)“文件頭”按鈕，點(diǎn)開(kāi)下拉菜單，就可以進(jìn)行頭內(nèi)容的設(shè)置了。
設(shè)置標(biāo)題，網(wǎng)頁(yè)標(biāo)題可以是中文、英文或符號(hào)，顯示在瀏覽器的標(biāo)題欄中。我們直接在設(shè)計(jì)窗口上方的標(biāo)題欄內(nèi)輸入或更改，就可以完成網(wǎng)頁(yè)標(biāo)題的編輯了。
插入關(guān)鍵字，關(guān)鍵字用來(lái)協(xié)助網(wǎng)絡(luò)上的搜索引擎尋找網(wǎng)頁(yè)。要想讓更多的人看見(jiàn)你的網(wǎng)站，這項(xiàng)要好好填哦^_^單擊上圖所示的“關(guān)鍵字”項(xiàng)，彈出“關(guān)鍵字”對(duì)話(huà)框，填入關(guān)鍵字即可。
插入META，META標(biāo)記用于記錄當(dāng)前網(wǎng)頁(yè)的相關(guān)信息，如編碼，作者，版權(quán)等，也可以用來(lái)給服務(wù)器提供信息。單擊上圖所示的“META”項(xiàng)，彈出“META”對(duì)話(huà)框，在“屬性”欄選擇“名稱(chēng)”屬性，在“值”文本框中輸入相應(yīng)的值，可以定義相應(yīng)的信息。
author—作者信息，copyright—版權(quán)聲明，generator—網(wǎng)頁(yè)編輯器。
2、設(shè)置頁(yè)面屬性
單擊“屬性欄”中的“頁(yè)面屬性”按鈕，打開(kāi)的“頁(yè)面屬性”對(duì)話(huà)框。
設(shè)置外觀(guān)，“外觀(guān)”是設(shè)置頁(yè)面的一些基本屬性。我們可以定義頁(yè)面中的默認(rèn)文本字體、文本字號(hào)、文本顏色、背景顏色和背景圖像等。我們?cè)O(shè)置頁(yè)面的所有邊距為0。
設(shè)置鏈接，“鏈接”選項(xiàng)內(nèi)是一些與頁(yè)面的鏈接效果有關(guān)的設(shè)置�！版溄宇伾倍x超鏈接文本默認(rèn)狀態(tài)下的字體顏色，“變換圖像鏈接”定義鼠標(biāo)放在鏈接上 時(shí)文本的顏色，“已訪(fǎng)問(wèn)鏈接”定義訪(fǎng)問(wèn)過(guò)的鏈接的顏色，“活動(dòng)鏈接”定義活動(dòng)鏈接的顏色。“下劃線(xiàn)樣式”可以定義鏈接的下劃線(xiàn)樣式。
設(shè)置標(biāo)題，“標(biāo)題”用來(lái)設(shè)置標(biāo)題字體的一些屬性。如下圖所示，在左側(cè)“分類(lèi)”列表中選擇“標(biāo)題”，這里的標(biāo)題指的并不是頁(yè)面的標(biāo)題內(nèi)容，而是可以應(yīng)用 在具體文章中各級(jí)不同標(biāo)題上的一種標(biāo)題字體樣式。我們可以定義“標(biāo)題字體”及6種預(yù)定義的標(biāo)題字體樣式，包括粗體、斜體、大小和顏色。按自己的喜歡的風(fēng)格 設(shè)置吧。
dreamweaver入門(mén)(2004版本):超級(jí)鏈接：
超級(jí)鏈接
作為網(wǎng)站肯定有很多的頁(yè)面，如果頁(yè)面之間彼此是獨(dú)立的，那么網(wǎng)頁(yè)就好比是孤島，這樣的網(wǎng)站是無(wú)法運(yùn)行的。為了建立起網(wǎng)頁(yè)之間的聯(lián)系我們必須使用超級(jí)鏈接。稱(chēng)“超級(jí)鏈接”，是因?yàn)樗裁炊寄苕溄樱纾壕W(wǎng)頁(yè)、下載文件、網(wǎng)站地址、郵件地址……等等。下邊我們就來(lái)討論怎樣在網(wǎng)頁(yè)中創(chuàng)建超級(jí)鏈接。
【頁(yè)面之間的超級(jí)連接】
在網(wǎng)頁(yè)中，單擊了某些圖片、有下劃線(xiàn)或有明示鏈接的文字就會(huì)跳轉(zhuǎn)到相應(yīng)的網(wǎng)頁(yè)中去。
1、在網(wǎng)頁(yè)中選中要做超級(jí)鏈接的文字或者圖片。
2、在屬性面板中單擊黃色文件夾圖標(biāo)，在彈出的對(duì)話(huà)框里選中相應(yīng)的網(wǎng)頁(yè)文件就完成了。做好超級(jí)鏈接屬性面板出現(xiàn)鏈接文件顯示。(如下圖)
3、按F12預(yù)覽網(wǎng)頁(yè)。在瀏覽器里光標(biāo)移到超級(jí)鏈接的地方就會(huì)變成手型。
〖提示〗你也可以手工在鏈接輸入框中輸入地址。給圖片加上超級(jí)鏈接的方法和文字完全相同。
如果超級(jí)鏈接指向的不是一個(gè)網(wǎng)頁(yè)文件。而是其他文件例如zip、exe文件等等，單擊鏈接的時(shí)候就會(huì)下載文件。
超級(jí)鏈接也可以直接指向地址而不是一個(gè)文件，那么單擊鏈接直接跳轉(zhuǎn)到相應(yīng)的地址。例如，在鏈接框里寫(xiě)上www.xxx.net那么，單擊鏈接就可以跳轉(zhuǎn)到讀書(shū)屋網(wǎng)站。
【郵件地址的超級(jí)連接】
在網(wǎng)頁(yè)制作中，還經(jīng)�？吹竭@樣的一些超級(jí)鏈接。單擊了以后，會(huì)彈出郵件發(fā)送程序，聯(lián)系人的地址也已經(jīng)填寫(xiě)好了。這也是一種超級(jí)鏈接。制作方法是：在編輯狀態(tài)下，先選定要鏈接的圖片或文字(比如：歡迎您來(lái)信賜教!)，在插入欄點(diǎn)或點(diǎn)插入菜單選“電子郵件鏈接”彈出如下對(duì)話(huà)框，填入E-Mail地址即可。
提示：還可以選中圖片或者文字，直接在屬性面板鏈接框中填寫(xiě)“mailto：郵件地址”。(如下圖)
創(chuàng)建完成后，保存頁(yè)面，按F12預(yù)覽網(wǎng)頁(yè)效果。
【制作圖片上的超級(jí)鏈接】
注意，我們這里所說(shuō)的圖片上的超級(jí)鏈接是指在一張圖片上實(shí)現(xiàn)多個(gè)局部區(qū)域指向不同的網(wǎng)頁(yè)鏈接。比如一張中國(guó)地圖的圖片，單擊了不同的省跳轉(zhuǎn)到不同的網(wǎng)頁(yè)。可點(diǎn)的區(qū)域就是熱區(qū)。為了演示制作效果下面的中國(guó)地圖我加了一些鏈接，你可以用鼠標(biāo)測(cè)試。鼠標(biāo)移動(dòng)到省份的熱區(qū)，會(huì)顯示提示，如果有預(yù)先設(shè)置的網(wǎng)站，點(diǎn)擊會(huì)進(jìn)入對(duì)方的網(wǎng)站。
【制作方法】
1、首先插入圖片。單擊圖片，用展開(kāi)的屬性面板上的繪圖工具在畫(huà)面上繪制熱區(qū)。
2、屬性面板改換為熱點(diǎn)面板如圖：鏈接輸入框：填入相應(yīng)的鏈接。替代框：填入你的提示文字說(shuō)明。目標(biāo)框：不作選擇則默認(rèn)在新瀏覽器窗口打開(kāi)。
3、保存頁(yè)面， 按F12預(yù)覽，用鼠標(biāo)在設(shè)置的熱區(qū)檢驗(yàn)效果。
提示：對(duì)于復(fù)雜的熱區(qū)圖形我們可以直接選擇多邊形工具來(lái)進(jìn)行描畫(huà)。替代框填寫(xiě)了說(shuō)明文字以后，光標(biāo)移上熱區(qū)就會(huì)顯示出相應(yīng)的說(shuō)明文字。
超級(jí)鏈接屬性面板中的目標(biāo)選項(xiàng)。
“目標(biāo)”我們稱(chēng)它為目標(biāo)區(qū)。也就是超級(jí)鏈接指向的頁(yè)面出現(xiàn)在什么目標(biāo)區(qū)域。默認(rèn)的情況下域中總有四個(gè)選項(xiàng)。
①_blank ：?jiǎn)螕翩溄右院�，指向�?yè)面出現(xiàn)在新窗口中。
②_parent：用指向頁(yè)面替換他外面所在的框架結(jié)構(gòu)。
③_self： 將連接頁(yè)面顯示在當(dāng)前框架中。
④_top： 跳出所有框架，頁(yè)面直接出現(xiàn)在瀏覽器中。
【小結(jié)】本節(jié)教程主要探討創(chuàng)建頁(yè)面的鏈接。
1、內(nèi)部鏈接：鏈接到本站點(diǎn)的其他文檔。
2、外部鏈接：鏈接到本站點(diǎn)以外的其他文檔。
3、E-Mail鏈接：?jiǎn)螕粼撴溄�，可以打開(kāi)瀏覽者的郵件系統(tǒng)。
4、圖片熱區(qū)鏈接：使你的鏈接更靈活更有個(gè)性。
dreamweaver入門(mén)(2004版本):表格設(shè)計(jì)：
表格設(shè)計(jì)
表格是現(xiàn)代網(wǎng)頁(yè)制作的一個(gè)重要組成部分。表格之所以重要是因?yàn)楸砀窨梢詫?shí)現(xiàn)網(wǎng)頁(yè)的精確排版和定位。本節(jié)教程我們分為兩步來(lái)進(jìn)行。首先看表格操作的一個(gè)實(shí)例。然后來(lái)看一些表格操作的基本方法。在開(kāi)始制作表格之前，我們首先對(duì)表格的各部分的名稱(chēng)做一個(gè)介紹。
一張表格橫向叫行，縱向叫列。行列交叉部分就叫做單元格。
單元格中的內(nèi)容和邊框之間的距離叫邊距。單元格和單元格之間的距離叫間距。整張表格的邊緣叫做邊框。
下面看看我們使用表格制作的頁(yè)面的實(shí)例
這幅頁(yè)面的排版格式，如果用以前我們所講的對(duì)齊方式是無(wú)法實(shí)現(xiàn)的。因此我們需要用到表格來(lái)做。實(shí)際上是用兩行兩列的表格來(lái)制作。
1、 在插入欄中選擇按鈕或“插入”菜單>選“表格”。系統(tǒng)彈出表格對(duì)話(huà)框。這些參數(shù)我們都已經(jīng)認(rèn)識(shí)了。行：2。列：2。其余的參數(shù)都保留其默認(rèn)值。。
2、 在編輯視圖界面中生成了一個(gè)表格。表格右、下及右下角的黑色點(diǎn)是調(diào)整表格的高和寬的調(diào)整柄。當(dāng)光標(biāo)移到點(diǎn)上就可以分別調(diào)整表格的高和寬。移到表格的邊框線(xiàn)上也可以調(diào)整。
3、 在表格的第一格按住左鍵不放，向下拖拽選中二格單元格。
然后在展開(kāi)的屬性面板中選擇合并單元格按鈕。將表格的單元格合并。如果要分割單元格，則可以用合并單元格按鈕右邊的按鈕。
4、 用鼠標(biāo)拖拽表格的邊框調(diào)整到適當(dāng)?shù)拇笮 ?/p>
5、 單擊左邊的單元格，然后輸入“攝影作品賞析”文字，并調(diào)整大小，因是豎排應(yīng)每個(gè)字回車(chē)一次。如果需要調(diào)整格子的大小。只需要鼠標(biāo)的光標(biāo)移動(dòng)到邊框上拖拽即可。
6、 在右邊上下單元格內(nèi)分別插入圖片和文本。頁(yè)面的基本樣子有了。
7、 光標(biāo)移動(dòng)到表格的邊框上單擊。表格周?chē)霈F(xiàn)調(diào)整框，表示選中整張表格。然后，在屬性面板中將“邊框”值設(shè)置適合的值，如果為0，邊框在編輯狀態(tài)，為虛線(xiàn)顯示，瀏覽時(shí)就看不見(jiàn)了。
一個(gè)符合要求的頁(yè)面在表格的幫助下做好了。
通過(guò)上面的操作我們對(duì)于表格有了一個(gè)初步的認(rèn)識(shí)。還要提示一點(diǎn)，對(duì)整幅表格操作和對(duì)一個(gè)單元格操作的時(shí)候，相應(yīng)的屬性面板是不同的。
表格顏色設(shè)置，選擇整幅表格后，利用屬性面板的顏色選擇器設(shè)置背景色。單元格也可單獨(dú)設(shè)置。鼠標(biāo)在需要設(shè)置的單元格點(diǎn)一下，其余操作同上。
下面我們就來(lái)看看這些屬性面板的區(qū)別。
表格的屬性面板，要出現(xiàn)這個(gè)面板必須先選中整幅表格，方法上面已經(jīng)提到過(guò)了。您可以在眾多選項(xiàng)中填入需要的參數(shù)。
選中了單元格之后屬性面板就發(fā)生如下變化了。選擇行或者列都屬于選中單元格。
對(duì)表格操作的幾種常用方式：
合并：將選中的連續(xù)單元格合并成為一個(gè)單元格。
分割：將一個(gè)單元格分割成若干單元格。
水平對(duì)齊方式：分為(左)(中)(右)三種。
垂直對(duì)齊方式：分為(頂)(居中)(居底)(基線(xiàn)對(duì)齊)
表格還可以增加或者刪除行或者列。在一個(gè)單元格中單擊鼠標(biāo)右鍵。在右鍵菜單中選擇表格選項(xiàng)>>選擇“插入行或列”。系統(tǒng)會(huì)彈出對(duì)話(huà)框如下。
在對(duì)話(huà)框里填入數(shù)據(jù)即可。最后要說(shuō)的是選中表格中的各種元素的方法：
選中一行，把光標(biāo)移到該行的最左邊單元格的左面，光標(biāo)會(huì)變成箭頭狀。單擊就可以選中一行。
選中一列，把光標(biāo)移到該列的最上邊單元格的上面，光標(biāo)會(huì)變成箭頭狀，然后單擊可以選中一列。
選中整張表格，把光標(biāo)移到表格的左上角或右邊框或下邊框線(xiàn)上。單擊即可選中整幅表格。選中的表格會(huì)在周?chē)霈F(xiàn)一個(gè)黑框表示整張表格選中了。
選中單元格。單元格可以同時(shí)選中多個(gè)。選擇連續(xù)的單元格，光標(biāo)先選中的一個(gè)單元格，按shift鍵不放，選取最后一個(gè)單元格。選不連續(xù)的單元格。按住Ctrl鍵，點(diǎn)取所需要的單元格即可。
我們對(duì)于表格的使用就講到這里，表格是網(wǎng)頁(yè)制作的基本技術(shù)，只有通過(guò)不斷實(shí)踐才能充分掌握。
dreamweaver入門(mén)(2004版本):框架技術(shù)：
框架技術(shù)
在瀏覽網(wǎng)頁(yè)的時(shí)候，我們常常會(huì)遇到這樣的一種導(dǎo)航結(jié)構(gòu)。就是超級(jí)連接做在左邊單擊以后鏈接的目標(biāo)出現(xiàn)在右面�；蛘咴谏线厗螕翩溄又赶虻哪繕�(biāo)頁(yè)面出現(xiàn)在下面。要做出這樣的效果，必須使用框架。為了更好的理解什么是框架。我們畫(huà)一張示意圖來(lái)進(jìn)行討論。
這是一個(gè)左右結(jié)構(gòu)的框架。事實(shí)上這樣的一個(gè)結(jié)構(gòu)是由三個(gè)網(wǎng)頁(yè)文件組成的。首先外部的框架是一個(gè)文件，圖中我們用index.htm命名�？蚣苤凶筮吤麨锳，指向的是一個(gè)網(wǎng)頁(yè)A.htm。右邊命名為B，指向的是一個(gè)網(wǎng)頁(yè)B.htm。
下面我們就來(lái)從頭開(kāi)始制作一個(gè)框架。(以左右框架結(jié)構(gòu)為例)
1、點(diǎn)“文件”菜單>新建，彈出“新建文檔”
或在插入欄>布局>選"框架：左框架"
Dreamweaver MX 2004生成一個(gè)空白的框架頁(yè)面，
2、選擇「窗口」菜單>“框架”，彈出“框架”面板。從框架面板可知，系統(tǒng)對(duì)左右框架生成命名。左框架名為：leftFrame，右框架名為：mainFrame，當(dāng)然您可以通過(guò)框架屬性面板對(duì)框架重新命名，了解這一點(diǎn)非常重要。創(chuàng)建超級(jí)鏈接時(shí)，要依據(jù)它正確控制指向的頁(yè)面。
3、保存框架。選擇“文件”菜單點(diǎn)擊“保存全部”。系統(tǒng)彈出對(duì)話(huà)框。這時(shí)，保存的是一個(gè)框架結(jié)構(gòu)文件。我們按照慣例都命名為index.htm。
保存的時(shí)候如果虛線(xiàn)框籠罩的是周?chē)蝗褪潜４婵蚣芙Y(jié)構(gòu)。
虛線(xiàn)籠罩在右邊就是保存框架中右邊網(wǎng)頁(yè)。
虛線(xiàn)籠罩在左邊就是保存框架中左邊的網(wǎng)頁(yè)：
三個(gè)頁(yè)面保存完畢。
4、下面我們要實(shí)現(xiàn)按左邊的超級(jí)鏈接，對(duì)應(yīng)的頁(yè)面出現(xiàn)在右邊。在左邊的頁(yè)面中做上超級(jí)鏈接。指向一個(gè)已經(jīng)存在的頁(yè)面。注意做好鏈接以后，要在目標(biāo)欄中設(shè)置為mainFrame。
6、設(shè)置完畢，保存全部，按F12預(yù)覽網(wǎng)頁(yè)。鏈接指向的頁(yè)面出現(xiàn)在右邊框架中。
7、重復(fù)以上步驟，把左框架所有的鏈接做完，一個(gè)簡(jiǎn)單的網(wǎng)站導(dǎo)航結(jié)構(gòu)創(chuàng)建完成。
框架有很多優(yōu)點(diǎn)，但是若理解不很透徹，容易搞混。如果您的網(wǎng)站頁(yè)面不多，可以創(chuàng)建一個(gè)不使用框架的Web頁(yè)面來(lái)完成框架的功能。例如，如果您想讓導(dǎo)航條顯示在頁(yè)面的左側(cè)或頂部，既可以使用框架頁(yè)面，也可以在每一頁(yè)包含該導(dǎo)航條而不使用框架。
[dreamweaver入門(mén)基礎(chǔ)]
【dreamweaver入門(mén)基礎(chǔ)】相關(guān)文章：
關(guān)于投資理財(cái)入門(mén)的基礎(chǔ)知識(shí)09-01
新手學(xué)化妝 淡妝入門(mén)基礎(chǔ)知識(shí)篇08-22
美白入門(mén)知識(shí) 零基礎(chǔ)也能美白05-14
建筑入門(mén)常識(shí)06-06
搭訕入門(mén)指南07-17
游泳入門(mén)技巧07-16
編程入門(mén)書(shū)籍10-17
seo入門(mén)書(shū)籍10-16
佛教入門(mén)書(shū)籍09-19
攝影入門(mén)的書(shū)籍08-05