web-dev-qa-db-ja.com

マスターページにCSSを含める方法

Asp.net Webサイトの特定のページにのみCSS参照を含めるにはどうすればよいですか？マスターページに参​​照を含めると、WebサイトのすべてのページがCSS参照を共有します。

asp.netmaster-pagesasp.net-2.0
23
Zo Has

デフォルト値を含むCSS ContentPlaceHolderを追加するだけです。

基本的に、デフォルトとして指定するCSSファイルは、子ページの<asp:Content />タグでそのプレースホルダーをオーバーライドしない限り含まれます。

マスターページは次のようになります。

<head>
    <asp:ContentPlaceHolder ID="Stylesheets" runat="server">
        <link rel="stylesheet" href="/css/master.css" type="text/css" />
    </asp:ContentPlaceHolder>
</head>

次に、そのマスターページを使用するページから、別のスタイルシートで単純にオーバーライドできます。

オン（例）AboutUs.aspx

<asp:Content ID="Content1" ContentPlaceHolderID="Stylesheets" runat="server">
    <link rel="stylesheet" href="/css/form.css" type="text/css" />
</asp:Content>
38
Marko

私の状況では、ソリューション内の異なる場所から同じマスターページを使用しました。そして、私のcssファイルへの参照の〜（ティルデ）プレフィックスなので、次のように参照にresponse.writeを追加しました：

<%= ResolveUrl("~/css/myStyle.css") %>
6
theodor.johannesen

サイトで複数のマスターページを使用できます。

ネストされたマスターページを使用することもできます。トップレベルには、一般的なサイト構造があり、その後、各エリアごとに1つのマスターネストマスターページがあります。

プロジェクトを右クリックして[追加]を選択すると、WebFormではなくWebContentFormオプションが選択されます。その後、適切なマスターページを選択できます。

ネストされたマスターページで、MasterPageFileをトップレベルのマスターページに等しく設定します。

編集 @Markoのアプローチと組み合わせると、次のことができます...

ここでの利点は、すべてのオーバーライドを1回記述するだけで済むことです。

トップレベルマスターページ：

<head>
    <asp:ContentPlaceHolder ID="Stylesheets" runat="server">
        <link rel="stylesheet" href="/css/default.css" type="text/css" />
    </asp:ContentPlaceHolder>
</head>

オーバーライドなしのネストされたMasterPage

<%@ Page Language="C#" MasterPageFile="~/Site.master"%>
//don't reference the Stylesheets ContentPlaceHolder and the default is rendered

Override.cssでネストされたMasterPage One

<%@ Page Language="C#" MasterPageFile="~/Site.master"%>
<asp:Content ID="Content1" ContentPlaceHolderID="Stylesheets" runat="server">
    <link rel="stylesheet" href="/css/override.css" type="text/css" />
</asp:Content>

SecondOverride.cssでネストされたMasterPage Two

<%@ Page Language="C#" MasterPageFile="~/Site.master"%>
<asp:Content ID="Content1" ContentPlaceHolderID="Stylesheets" runat="server">
    <link rel="stylesheet" href="/css/secondOverride.css" type="text/css" />
</asp:Content>

次に、任意のWebフォームに適切なマスターページを設定します。

6
Daniel Dyson