主題和外觀是ASP.NET 2.0 中的新增功能, 使用 ASP.NET 2.0 的“主題和外觀”功能，可以將樣式和布局信息分解為單獨的文件組，統(tǒng)稱為“主題”。然后，主題可應(yīng)用于任何站點，影響站點中頁和控件的外觀。這樣，通過更改主題即可輕松地維護對站點的樣式更改，而無需對站點各頁進行編輯。還可與其他開發(fā)人員共享主題。應(yīng)用 ASP.NET 2.0的“主題和外觀”功能輕松實現(xiàn)對網(wǎng)站美觀的控制。

　　ASP.NET 提供了一些可在應(yīng)用程序中對頁和控件的外觀或樣式進行自定義的功能。控件支持 Style 對象模型，用于設(shè)置字體、邊框、背景色和前景色、寬度、高度等樣式屬性。控件還完全支持可將樣式設(shè)置與控件屬性分離的級聯(lián)樣式表 (CSS)。可以將樣式信息定義為控件屬性或 CSS，也可以在名為 Theme 的單獨文件組中定義此信息，以便應(yīng)用于應(yīng)用程序的全部或部分頁。各控件樣式在主題中被指定為 Skin。

　　“主題”，它提供了一種簡易方式，可以獨立于應(yīng)用程序的頁為站點中的控件和頁定義樣式設(shè)置。多個主題的優(yōu)點在于，設(shè)計站點時可以不考慮樣式，以后應(yīng)用樣式時也無需更新頁或應(yīng)用程序代碼。此外，還可以從外部源獲得自定義主題，以便將樣式設(shè)置應(yīng)用于應(yīng)用程序。一個主題的優(yōu)點在于，樣式設(shè)置存儲在一個位置，可以獨立于應(yīng)用該主題的應(yīng)用程序來維護這些設(shè)置。

　　下面的示例演示的頁具有同一個主題，應(yīng)用該主題指定控件樣式設(shè)置。注意，該頁本身并不需要包含任何樣式信息。在運行時該主題自動將樣式屬性應(yīng)用于該頁的控件。

　　新建一個Web 項目，點擊“添加新項”，選擇“主題外觀”并命名為“Button.skin”,點擊“添加”按扭，如圖 1所示

圖 1

　　當(dāng)單擊“添加”按扭以后會彈出如下對話框 圖 2 問你是否將主題文件添加到“App_Themes”文件夾，在應(yīng)用程序中，主題文件必須存儲在根目錄的App_Themes文件夾下，主題由此文件夾下的命名子目錄組成，該子目錄包含一個或多個具有 .skin 擴展名的外觀文件的集合。主題還可以包含一個 CSS 文件和/或圖像等靜態(tài)文件的子目錄。我們單擊“是”，這樣就為Web添加一個名為“Button”的主題。如圖 3

圖 2 圖 3

　　我們可以看到在App_Themes文件夾下有一個所創(chuàng)建的主題Button，在Button文件夾下有一個Button.skin文件，這就是我們添加的主題文件，雙擊Button.skin文件，為其添加皮膚設(shè)置代碼。
代碼如下：

＜asp:Button runat="server" BorderColor="yellow" BackColor="yellow" BorderStyle="dotted" /＞ ＜asp:Button runat="server" BorderColor="blue" BackColor="white" SkinID="Blue" /＞ ＜asp:Button runat="server" BorderColor="red" BackColor="red" Width="150" BorderWidth="2px" SkinID="red" /＞

　　從代碼中我們可以看到，我們?yōu)锽utton控件設(shè)置了三個皮膚主題，＜asp:Button runat="server" BorderColor="yellow" BackColor="yellow" BorderStyle="dotted" /＞，這是默認(rèn)的皮膚，在Web頁面中我們使用Button控件時的默認(rèn)設(shè)置，＜asp:Button runat="server" BorderColor="blue" BackColor="white" SkinID="Blue" /＞，＜asp:Button runat="server" BorderColor="red" BackColor="red" Width="150" BorderWidth="2px" SkinID="red" /＞設(shè)置了SkinID 分別為Blue和red的主題皮膚。

　　從上一個示例中可以注意到，外觀文件的內(nèi)容只不過是控件定義（如果這些定義出現(xiàn)在頁面中）。一個外觀文件可以包含多個控件定義，例如，每種控件類型一個定義。在主題中定義的控件屬性自動重寫應(yīng)用了主題的目標(biāo)頁中同一類型的控件的本地屬性值。
　主題可位于應(yīng)用程序級或計算機級（全局適用于所有應(yīng)用程序）。如上所述，應(yīng)用程序級主題放在應(yīng)用程序根目錄下的 App_Themes 目錄中。全局主題放在 ASP.NET 安裝目錄下 ASP.NETClientFiles 文件夾下的“Themes”目錄中，例如 %WINDIR%\Microsoft.NET\Framework\＜version＞\ASP.NETClientFiles\Themes。對于 IIS 網(wǎng)站，全局主題的位置是 Inetpub\wwwroot\aspnet_client\system_web\＜version＞\Themes。

　　我們設(shè)置好應(yīng)用主題后，那么怎么為頁指定主題呢？我們在頁面中添加4個Button按扭，設(shè)置如圖 4

圖4

　　代碼如下：

＜%@ Page Language="C#" AutoEventWireup="true" Theme="Button" CodeFile="Default.aspx.cs" Inherits="_Default" %＞ ＜!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"＞ ＜html xmlns="http://www.w3.org/1999/xhtml" ＞ ＜head runat="server"＞ ＜title＞無標(biāo)題頁＜/title＞ ＜/head＞ ＜body＞ ＜form id="form1" runat="server"＞ ＜div＞ ＜asp:Button ID="Button1" runat="server" Text="Button" /＞     默認(rèn)皮膚的Button控件＜br /＞ ＜br /＞ ＜br /＞ ＜asp:Button ID="Button2" runat="server" Text="Button" SkinID="Blue"/＞    命名皮膚SkinID="Blue"的Button控件＜br /＞ ＜br /＞ ＜br /＞ ＜asp:Button ID="Button3" runat="server" Text="Button" SkinID="red"/＞    命名皮膚SkinID="red"的Button控件＜br /＞ ＜br /＞ ＜br /＞ ＜asp:Button ID="Button4" runat="server" BackColor="DarkOrange" BorderColor="#C000C0" ForeColor="Yellow" Text="Button" Width="174px" EnableTheming="False"/＞    禁用主題的Button控件＜br /＞  ＜/div＞ ＜/form＞ ＜/body＞ ＜/html＞

　　如上所示，通過將 ＜%@ Page " Theme="Button" %＞ 指令設(shè)置為全局主題或應(yīng)用程序級主題的名稱（Themes 或 App_Themes 目錄下的文件夾的名稱），可為單個頁指定主題。一頁只能應(yīng)用一個主題，但該主題中可以有多個外觀文件，用于將樣式設(shè)置應(yīng)用于該頁中的控件。這樣Button.skin中設(shè)置的屬性就應(yīng)用到頁面中。也可通過在 Web.config 中指定 ＜pages theme="..."/＞ 節(jié)，也可以為應(yīng)用程序中的所有頁定義應(yīng)用的主題。若要對特定頁取消設(shè)置此主題，可以將 Page 指令的 Theme 屬性設(shè)置為空字符串 ("")。請注意，母版頁不能應(yīng)用主題。
　　在頁面中有4個Button按扭，其中前三個應(yīng)用了Button.skin文件中設(shè)置的主題，Button1控件應(yīng)用了Button.skin中設(shè)定的默認(rèn)皮膚；Button2控件應(yīng)用了Button.skin中SkinID為Blue的命名皮膚；Button3控件應(yīng)用了Button.skin中SkinID為Blue的命名皮膚，為控件指定皮膚主題也很簡單，只要指定相應(yīng)的SkinID屬性，入圖5

圖5

　　默認(rèn)情況下，外觀文件中的控件定義應(yīng)用于受主題影響的應(yīng)用程序的頁中同一類型的所有控件。但是，您可能希望同一類型的控件在應(yīng)用程序中不使用外觀。例如，您可能希望 Button4 控件不使用Button.skin文件中設(shè)置的主題。那么我們也可以對控件禁用主題在示例中Button4按扭通過將EnableTheming 屬性設(shè)置為 false，可將特定控件排除在主題之外，＜asp:Button ID="Button4" runat="server" BackColor="DarkOrange" BorderColor="#C000C0" ForeColor="Yellow" Text="Button" Width="174px" EnableTheming="False"/＞。

　　運行這個程序，如圖6

圖6

轉(zhuǎn)載于:https://www.cnblogs.com/focustea/archive/2008/08/20/1272552.html

總結(jié)

以上是生活随笔為你收集整理的ASP.NET 2.0主题和皮肤实现网站美化的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。