【文章內(nèi)容簡介】 以取消或者增加，那么當(dāng)你顯示全部的工具欄時，和關(guān)閉全部工具欄時 ，頁面的尺寸是不一樣的。 在網(wǎng)頁設(shè)計過程中，向下拖動頁面是惟一給網(wǎng)頁增加更多內(nèi)容 (尺寸 )的方法。除非你能肯定站點的內(nèi)容能吸引大家拖動，否則不要讓訪問者拖動頁面超過三屏。如果需要在同一頁面顯示超過三屏的內(nèi)容，那么你最好能在上面做上頁面內(nèi)部連接，方便訪問者瀏覽。 （ 2）整體造型 造型就是創(chuàng)造出來的物體形象，這里是指頁面的整體形象。這種形象應(yīng)該是一個整體，圖形與文本的接合應(yīng)該是層疊有序。雖然，顯示器和瀏覽器都是矩形，但對于頁面的造型，你可以充分運用自然界中的其它形狀以及它們的組合：矩形，圓形，三角形，菱形等。 對 于不同的形狀，它們所代表的意義是不同的。比如矩形代表著正式，規(guī)則，你注意到很多 ICP 和政府網(wǎng)頁都是以矩形為整體造型；圓形帶表著柔和，團結(jié)，溫暖， 6 安全等，許多時尚站點喜歡以圓形為頁面整體造型；三角形代表著力量，權(quán)威，牢固，侵略等，許多大型的商業(yè)站點為顯示它的權(quán)威性常以三角形為頁面整體造型；菱形代表著平衡，協(xié)調(diào)，公平，一些交友站點常運用菱形作為頁面整體造型。雖然不同形狀帶表著不同意義，但目前的網(wǎng)頁制作多數(shù)是接合多個圖形加以設(shè)計，在這其中某種圖形的構(gòu)圖比例可能占的多一些。 （ 3）頁頭 頁頭又可稱之為頁眉，頁眉的作 用是定義頁面的主題。比如一個站點的名字多數(shù)都顯示在頁眉里。這樣，訪問者能很快知道這個站點是什么內(nèi)容。頁頭是整個頁面設(shè)計的關(guān)鍵，它將牽涉到下面的更多設(shè)計和整個頁面的協(xié)調(diào)性。頁頭常放置站點名字的圖片和公司標(biāo)志以及旗幟廣告。 （ 4）文本 文本在頁面中出現(xiàn)都數(shù)以行或者塊 (段落 )出現(xiàn)，它們的擺放位置決定者整個頁面布局的可視性。在過去因為頁面制作技術(shù)的局限，文本放置的位置的靈活性非常小，而隨著 DHTML 的興起，文本已經(jīng)可以按照自己的要求放置到頁面的任何位置。 （ 5）頁腳 頁腳和頁頭相呼應(yīng)。頁頭是放置站點主題的地方，而頁 腳是放置制作者或者公司信息的地方。你能看到，許多制作信息都是放置在頁腳的。 （ 6）圖片 圖片和文本是網(wǎng)頁的兩大構(gòu)成元素，卻一不可。如何處理好圖片和文本的位置成了整個頁面布局的關(guān)鍵。而你的布局思維也將體現(xiàn)在這里。 （ 7）多媒體 除了文本和圖片，還有聲音，動畫，視頻等等其它媒體。雖然它們不是經(jīng)常能被利用到，但隨著動態(tài)網(wǎng)頁的興起，它們在網(wǎng)頁布局上也將變得更重要。 網(wǎng)頁布局的技術(shù) 網(wǎng)頁的布局有表格布局，框架布局， CSS 布局等，本網(wǎng)站采用的是表格布局，表格布局被廣泛使用，已經(jīng)成為一個潛在的標(biāo)準(zhǔn)。隨便瀏覽一個站 點，它們一定是用表格布局的。表格布局的優(yōu)勢在于它能對不同對象加以處理，而又不用擔(dān)心不同對象之間的影響。而且表格在定位圖片和文本上比起用 CSS 更加方便。表格布局唯一的缺點 7 是，當(dāng)你用了過多表格時，頁面下載速度受到影響 [8]。對于表格布局，打開一個站點的首頁，然后保存為 HTML 文件，利用網(wǎng)頁編輯工具打開它 (要所見即所得的軟件 )，會可以看到這個頁面是如何利用表格的。 網(wǎng)站的層次結(jié)構(gòu)圖 如本網(wǎng)站的總體結(jié)構(gòu)圖，如圖 32 圖 32 網(wǎng)站總體結(jié)構(gòu)圖 4. 建立網(wǎng)頁連接 網(wǎng)站實際上是由很多網(wǎng)頁組成的，那么網(wǎng)頁之間是如何聯(lián)系的呢？這就是本章要講的內(nèi)容 網(wǎng)頁的“鏈接”。“鏈接”，又稱“超鏈接 （ Hyperlink） ,它作為網(wǎng)頁的橋梁。網(wǎng)頁中的很多對象都可以加入“鏈接”屬性。在 Dreamweaver 8 中，如果以“鏈接”的媒介來劃分的話，則“鏈接”可以分為“文字鏈接”、“圖像鏈接”、“圖像地圖鏈接”、“內(nèi)部鏈接和外部鏈接”、“ Email 鏈接”、“命名錨記鏈接”、“文件下載鏈接”和“跳轉(zhuǎn)菜單”，共 8種。 文字連接和跳轉(zhuǎn)菜單 網(wǎng)站大多采用的是文字連接和 跳轉(zhuǎn)菜單， “文字 鏈接 ”即以文字作 為媒 介的 鏈接 ，它是網(wǎng) 頁 中最常被使用的 鏈接 方式，具有“文件小、制作 簡單 和便于 維護 ”的特 點 。首頁 新品上架 特價商品 會員資料修改 購物車 查看訂單 銷售排行 聯(lián)系我們 收藏本站 設(shè)為首頁 時尚衛(wèi)衣 牛仔天地 襯衫 裙子 外套 8 接下 來結(jié)合 我的 個 人網(wǎng)站 為實 例， 來講解 如何 為 文字建立“ 鏈接 ”。操作步 驟 ： 步 驟 1 、準(zhǔn) 備 好已 經(jīng) 制作完成的首 頁 的各 個欄 目 頁 面 步 驟 在 Dreamweaver 中 打開 首 頁 ，之后反白 選 取作 為 “ 鏈接 ”的文字。 步 驟 觀 察 “ 屬 性面板”，其中包括一 個 “ 鏈接 ”文本框。 步 驟 接下 來 需要把 鏈接 的位址加入到文本框中。 步 驟 在“ 鏈接 ”文本框下面 還 有一 個 “目 標(biāo) ”下拉列表， 從 中可以 選擇鏈接網(wǎng) 頁顯 示的窗口方 式，共有 4種。如 圖 ： 41 41 下拉列表 步 驟 還 可 以設(shè) 置一些“ 鏈接 ” 的屬 性， 單擊 “ 屬 性面板”中的“ 頁 面 屬 性”，選擇 其中的“ 鏈接 ” 分類 ，可以 進 行的 設(shè) 置有“ 鏈接 字體”、“大小”、“ 鏈接顏 色”、“ 變換圖 像 鏈接 ” 顏 色、“ 已訪問鏈接 ” 顏 色、“活 動鏈接 ” 顏 色及“下劃 線樣 式”。 步 驟 至此，第 1 個欄 目的 鏈接 就制作完 畢 了，按下 Ctrl+S 保存網(wǎng) 頁 ，再按下 F12 預(yù)覽，測試 一下， 當(dāng) 鼠 標(biāo) 放在“放松心情” 這 4個 文字 上時將變 成手形，并且瀏覽 器窗口下面的 狀態(tài)區(qū) 中 會顯 示 鏈接到 的網(wǎng) 頁 的位址， 單擊 文字， 頁 面 會立即跳轉(zhuǎn)到第 1個欄 目中， 這 表示 鏈接 已 經(jīng) 制作成功了。 步 驟 同理，按照以上步 驟 ，再 為 “閑情逸致”和“個人主頁”等其它 欄 制作指向 對應(yīng)欄 目的 鏈接 。 至此，整 個 “文字 鏈接 ”的 實 例就全就全部完成了 。 “ 圖 像”也是常被使用的 鏈接 媒體，它和“文字 鏈接 ”非常相似。 為圖 像加入 鏈接 ，首先 應(yīng)該 在網(wǎng) 頁 中插入“ 圖 像”，有 關(guān) 插入“ 圖 像”或“ 導(dǎo) 航 條 ” 按 鈕 的 內(nèi) 容，接下 來 以我的網(wǎng)站“ my web“ 為 例， 講解 如何建立“ 圖 像 鏈接 ”。操作步 驟 ： 步 驟 首先仍然要準(zhǔn) 備 好已 經(jīng) 制作完成的首 頁 和各 個欄 目的 頁 面 步 驟 在 Dreamweaver 中 打開 網(wǎng)站的首 頁 ，之后 選 取 要制作“ 鏈接 ”的 圖 像。 步 驟 觀 察 “ 屬 性面板”，在“ 鏈接 ”文本框中 輸 入 鏈接 的文字位址。 步 驟 如果有需要，可以在“目 標(biāo) ”下拉列表中 選擇 “ 鏈接 ”網(wǎng) 頁顯 示的窗口 9 方式，分 別為 blank 、 parent 、 self 或 top。 步 驟 至此，第 1 個欄 目的 圖 像 鏈接 就制作完 畢 了，