ASP.NET 利用 CSS 實現多介面切換的兩種方法

透過動態載入不同 CSS 實現多介面（類似部落格換膚功能）

方法一：動態建立 LINK 標籤引用樣式表

<%@page language="C#"%>
<%@import namespace="System.Data"%>
<script language="c#" runat="server">
public void page_load(Object obj,EventArgs e)
{
//建立伺服器端控制項。
//指定標記 "LINK" 初始化此類別新實例。
HtmlGenericControl objLink=new HtmlGenericControl("LINK");
objLink.ID=ID;
objLink.Attributes["rel"]="stylesheet";
objLink.Attributes["type"]="text/css";
objLink.Attributes["href"]="portal.css";
//此控制項不產生任何可見輸出,僅作為其他控制項容器,可在其中加入、插入或移除控制項。
MyCSS.Controls.Add(objLink);
}
</script>
<html>
<head>
<title>c#</title>
<asp:placeholder id="MyCSS" runat="server"></asp:placeholder>
</head>
<body bgColor="#ffcc66" style="FONT:9pt">
<form runat="server">
</form>
</body>
</html>

方法二：動態設定頁面所有同類型控制項樣式

可透過改變 Web 控制項的 CssClass 屬性，方便設定與修改控制項樣式。但在實際開發中，逐個設定控制項 CssClass 屬性非常繁瑣，故此思路應用不廣。

但下列程式碼示範一次性改變頁面所有同類型控制項樣式的方法，可實現簡單的 SKIN 功能。

public void page_load(Object obj,EventArgs e)
{
if(!Page.IsPostBack){
 //為頁面所有控制項設定樣式。
 SetCSS(Page.Controls);
}
}
private void SetCSS(System.Web.UI.ControlCollection vControls)
{
for(int i=0;i<vControls.Count;i++)
{
System.Web.UI.Control vControl=vControls[i];
//得到控制項型別
//可增加控制項型別及相應處理方法
string PType=vControl.GetType().Name;
switch (PType)
{
case "TextBox":
TextBox_CSS ((TextBox) vControl);
break;
case "Button":
//Button_CSS ((Button) vControl);
break;
case "DataGrid":
//DataGrid_CSS ((DataGrid) vControl);
break;
}
if(vControl.Controls.Count>0)
SetCSS(vControl.Controls);
}
}
private void TextBox_CSS(TextBox tb){
tb.CssClass="TextBox_show";
}
<form runat="server">
<asp:textbox id="Search1" runat="server"/>
<asp:textbox id="Search2" CssClass="INPUT" runat="server"/>
</form>

執行後，檢視頁面原始碼，可發現文字方塊樣式已統一修改為 "TextBox_show"。