ASP.NET 2.0配合MasterPage的優化CSS

2024-07-10 13:10:38

字體：大中小

來源：轉載

供稿：網友

　　asp.net 2.0 中增加了內建的 masterpage 的支持，這對我們來說是一個很大的便利。然而經過一段時間的使用，我發現 masterpage 并不是那么完美：嵌套的 masterpage 不能支持設計時界面，以及下面要提到的content page 中增加 css 的問題。

　　通常，在沒有 2.0 之前，我們在頁面里要增加一個 css 引用的語法如下：

＜link rel="stylesheet" href="css/test.css" /＞

　　原本是很平常的做法。但是在一個 masterpage 的子頁面中，出現了一個很尷尬的局面，就是：我們該把上述代碼放到什么位置？

　　因為 masterpage 的具體內容頁面中，只能定義一個個的＜asp:content /＞標簽的內容。我們按照通常的做法在 aspx 里面無法對頁面的＜header/＞內容進行控制。而這個＜link/＞標簽又必須放在＜header/＞內。我試驗過在＜asp:content /＞內部加入這行代碼，但是會提示出錯的。

　　同時，我們也無法在 masterpage 的＜header/＞內部放好一個 contentplaceholder 用于將來放入 css 的引用代碼。

　　因此我的做法是定義了一個 helper 類如下：

static public class controlhelper
{
　static public void addstylesheet(page page, string csspath)
　{
　　htmllink link = new htmllink();
　　link.href = csspath;
　　link.attributes["rel"] = "stylesheet";
　　link.attributes["type"] = "text/css";
　　page.header.controls.add(link);
　}
}

　　這樣，在具體頁面，我們就可以通過如下代碼添加 css 引用：

protected void page_load(object sender, eventargs e)
{
　controlhelper.addstylesheet(this.page, "css/projectpage.css");
}

　　并且，這個代碼支持在具體內容頁面，或者一個嵌套的 master page 中使用。

　　說到這里也許有人會問，為什么要把 css 分開成這樣來加載呢？有必要嗎？我把所有頁面的 css 定義到幾個公共 css 文件里豈不是很好？

　　其實，熟悉 web 標準的 html 制作的朋友一定知道，在比較完美的狀態下，頁面的 html 和用于表現的 css 應該徹底分離。而我們基于 web 標準的設計，通常是先做出一個 master page 中各個框架 div 的定位代碼，以及 header，footer 部分的修飾代碼。這些是每個內容頁面都要用到的，會放在一個統一的 css 里面。其他的具體內容頁面，每個頁面又會有各自不同的內容的布局，修飾樣式，因此我把每個具體頁面特定的部分放在它自己的 css里。這樣就形成了一個按照 master page 的實現層次（可嵌套），逐層合并的 css 模型。其好處是實現了每個 css 文件的職責分離，更容易理解和維護。

上一篇：.Net中操作MySql數據庫的方法

下一篇：ASP.NET 2.0 中配合Master Page使用的優化CSS模型