2016-10-12 32 views
0

現在のBODY CSSをハロウィンのCSSテーマに変更したいと考えています。問題は私の.Netページがテンプレートであることです。 CSSテーマの上書きが存在するかどうかを確認するためにボディクラスを取得する方法が必要ですか?私のウェブサイトの「CSSテーマ」を上書きする方法はありますか?

私はこのような何かを行うことによってテーマを変更することはできます:

CSS:

/* standard theme */ 
body { 
    background-color: white; 
    font-color: #000; 
} 

/* halloween theme css */ 
body.halloween { 
    background-color: black; 
    font-color: #666; 
} 

その後HEADの編集可能領域に配置された本:

<% 
'CSS Theme overwrite - uncomment if required 
cssTheme = "halloween" 
%> 

私のBODYタグ

<body class="<%=cssTheme%"> 
    content........ 
</body> 

私は上記を試しましたが、動作しません。

<body>には、cssThemeをチェックして適用するdoOnLoad()関数が必要ですか? global.asax.csで

+0

がCSSファイルのですか?新しいCSSファイルに置き換えることはできますか? – Cato

+0

できますが、 ''タグはテンプレートとしてロックされています。また、.halloween CSSはすでに存在するCSSクラスを上書きしません。 –

+0

これは.net言語ですか?あなたは、global.asax(または同等のもの)のレンダリングイベントの1つに入り、.cssが新しい名前を持つようにエミットされているhtmlを変更することができます(その.cssが存在する限り、ブラウザはそれを拾う) – Cato

答えて

-1

- たとえば、C#

void Application_PostReleaseRequestState(object sender, EventArgs e) 
    { 

     if (Response.ContentType == "text/html") 
      Response.Filter = new myFilter(Response.Filter); 

    } 

    class myFilter:System.IO.MemoryStream 
    { 

     private System.IO.Stream outputStream =null; 

     public myFilter(System.IO.Stream output) 
     { 
      outputStream = output; 
     } 

     public override void Write(byte[] buffer, int offset, int count) 
     { 

      var contentInBuffer = System.Text.UTF8Encoding.UTF8.GetString(buffer); 


      //change the .css here 
      contentInBuffer = contentInBuffer.Replace(@"MainDesign.css", @"MainDesign_hallow.css"); 

      outputStream.Write(System.Text.UTF8Encoding.UTF8.GetBytes(contentInBuffer), offset, System.Text.UTF8Encoding.UTF8.GetByteCount(contentInBuffer)); 
     } 

    } 
0

のためにはい、あなたはこれを行うことができます - CSSでの「C」はあなたとあなたのスタイルシートの特定の要素を上書きすることができることを意味している、カスケードの略より具体的な定義。

これはdivで以下に説明されていますが、bodyまたはHTML内の他の要素ではまったく同じ方法で動作します。 (注:JavaScriptは無関係であり、そしてちょうどあなたが表示されますHalloweenが異なるプレゼンテーションルールを定義するCSSクラスを追加するために使用する。)

$('button').click(function(){ 
 
$('div').addClass("halloween"); 
 
});
div{ 
 
    background-color:grey, 
 
    color:Black 
 
} 
 

 
div.halloween{ 
 
    background-color:black; 
 
    color:orange 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    Content here 
 
</div> 
 

 
<button>make halloween</button>

関連する問題