ASP.NET テーマを使用してデザインを管理する

■スキンを作成します。
プロジェクト直下に「新しい項目の追加」より「スキンファイル」を追加します。
ファイル名は「SkinA.skin」とします。
スキンファイルを追加すると
プロジェクト直下にAspNetフォルダ「App_Themes」がなければ自動で作成され、「App_Themesフォルダ」内に「SkinA」フォルダが自動で作成されます。

■スキンファイルにデザインを定義します。

<asp:TextBox Runat="server"
    BackColor="#C0FFC0" 
　  BorderColor="#004000">

</asp:TextBox>



<asp:Button Runat="server" 
　  BackColor="#C0FFC0" 
　  BorderColor="DarkGreen">

</asp:Button >



<asp:Button Runat="server"
    BackColor="#FFFFC0" 
    BorderColor="Yellow" 
    SkinID="sp">

</asp:Button >

■確認ページを作成します。
プロジェクト直下に「ThemeSampleフォルダ」を作成し、Themeフォルダ内に「新しい項目の追加」より「Webフォーム」を追加します。
ページにTextBoxコントロールを１つ、Buttonコントロールを2つ配置します。
片方のButtonのSkinIDプロパティを「sp」とします。
Documentの「Theme」プロパティを「SkinA」とします。

■実行します。


■まとめ
ページ単位でテーマを指定するにはDocumentの「Theme」プロパティにスキンファイル名を指定します。
スキンファイルのskinID属性を設定した場合には、同一のskinID属性を持つサーバ・コントロールに対してのみデザインが適用されます。
スキンファイルのskinID属性を持たないスキン定義は「デフォルト・スキン」と呼ばれ、skinID属性を持たないサーバ・コントロールに対して適用されるデフォルトのデザインと見なされます。


■フォルダ単位でテーマを設定します。
「ThemeSampleフォルダ」に「新しい項目の追加」より「Web構成ファイル」を追加します。
web.configファイルのpages要素をを設定します。

<configuration>

    <appSettings/>

    <connectionStrings/>

    <system.web>

      <pages theme ="SkinA" />

    </system.web>

</configuration>

■アプリケーション全体でテーマを設定します。
フォルダ単位でテーマを設定すると同様に、プロジェクト直下のWeb.configのPages要素を< pages theme="SkinA" >に変更します。