Master Page 内容页中使用CSS
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 中使用。