資料來源：http://www.iiiedu.org.tw/taipei/student/paper/tihs10r.htm
ASP.NET 2.0：利用Master Page打造網頁的樣版
|
|
|
· 摘要
使用樣版(Template)的觀念來設計網頁是一個很重要的技巧，因為同一個網站的網頁通常需要使用相同的樣式與風格，以便讓網站的使用者使用起來有一致的感覺，開發ASP網頁的程設計師可以使用#include檔案的技巧引入一個共用的檔案當做網頁的開頭、結尾、或是左右兩邊的功能表或廣告，讓所製作的每一個網頁擁有一致的介面，達到樣版的功能，而且也可以縮短設計網頁操作介面的時間，讓網頁容易維護。ASP.NET網頁的程設計師可以使用User Control製作每一個網頁欲使用的開頭、結尾、或是左右兩邊的功能表或廣告當做樣版，再拿給每一個網頁使用，讓同一個網站的每一個網頁都可以有一致的操作介面和感覺，當然也可以得到縮短設計網頁操作介面的時間，使網站易於維護，除此之外，使用User Control設計的ASP.NET的網頁還可以經由把User Control放置到快取記憶體的做法來改善將網頁的內容顯示給網際網路使用者瀏覽的效能，但是#include 檔案和使用User Control來製作樣版功能都不是網頁設計工具內建的做法，也就是說要靠網頁的設計師自行套用才能享受利用樣版設計網頁的好處，針對這一點，ASP.NET 2.0提出一個新的功能，Master Page，讓網頁設計師可以採用視覺編輯的方式設計網站中每一個網頁欲套用的樣版，再套用到網站中每一個網頁，達到風格一致的效果，縮短網頁的設計和維護的時間，提升網頁開發的生產力。本文將帶領大家一探ASP.NET 2.0的Master Page功能的奧秘，並使用ASP.NET 2.0提供的Master Page樣版功能快速開發風格一致的網頁。
|
˙[特別注意] 本文中的示範是採用Visual Studio 2005 Beta 1版製作的，其程式的寫法與程式開發工具的使用方法可能會和最終讀者拿到的Visual Studio 2005正式版產品有所出入，您所看到的操作功能表和操作畫面也會和您使用Visual Studio 2005時採用那一種開發工具的操作習慣而稍有不同。
|
| |
| | · 認識Master Page和Content Page |
| ASP.NET 2.0提出的Master Page和Content Page的觀念，可以幫助網頁的設計者快速地設計網頁的樣版，例如網頁的設計者想要讓網頁中的每一個網頁都具有相同的頁首、頁尾、左方功能表、以及右方的廣告超連結，就可以設計類似圖1的Master Page： |
| | |
| | 圖1：Master Page與Content Page |
 |
| 圖1中的頁首、頁尾、左方功能表、以及右方的廣告超連結就是Master Page的結構，而中央空白的地方就是放置內容網頁(即Content Page)的地方，網頁設計者只要更換合適的內容網頁就可以快速製作出一堆風格與樣式一致的網頁，其概念和做法類似ASP網頁的#include檔案和ASP.NET 1.X的User Control的做法，只不過是利用ASP.NET 2.0內建的Master Page來製作而已。了解Master Page的用途之後，接下來我們就要使用Visual Studio 2005提供的Master Page功能建立一個網頁風格一致的網站。 |
| |
| 建立Master Page |
| 首先使用[Project]功能表底下的[New]功能底下的[Web Site]功能建立一個ASP.NET網站，然後使用滑鼠的右鍵點中[Solution Explorer]視窗中的專案，選擇出現的功能表中的[Add New Item]功能，再從出現的視窗中選擇[Master Page]項目，表示要為網站加入Master Page，如圖2所示： |
| |  |
| 圖2：為網站加入Master Page的畫面 |
| | |
| | 在[Name]欄位中輸入Master Page檔案的名稱之後按下[Add]鍵，Visual Studio 2005就會為我們的網站加入一個Master Page，其副檔名預設為(*.master)，並開啟剛加入的Master Page供您編輯，請注意其中的<% master %>標籤，表示這是一個Master Page，其中可以放置任何的HTML元素和Server控制項，包括、、和
|
|
|
沒有留言:
張貼留言