BODY要素の特定のクラスからHTML要素をターゲットにする方法

Drupalを使用して、テーマには<HTML>要素に割り当てられた背景色があります。 1つの特定のページに対して別のprint CSSを作成しています。ユーザーがページを印刷するときにこのページの背景色のみを削除したいと考えています。 <HTML>要素にはクラスもidもありませんが、<BODY>要素があります。BODY要素の特定のクラスからHTML要素をターゲットにする方法

<HTML style="background-color:#666"> 
    <BODY class=specialPage> 
    </body> 
</html>

私は<BODY>の親要素をしたいことを指定する方法はありますか？または<BODY>のクラスに基づいて<HTML>をターゲティングする方法はありますか？

EDIT：jQueryので

|------------------------| 
|   <HTML>   | 
|  |----------|  | 
|  |   |  | 
|  | <BODY> |  | 
|  |   |  | 
|  |----------|  | 
|      | 
|------------------------|

出典

2011-12-28 Mechaflash

次の操作を行うことができます

$('body.specialPage').parent('html').css({'background-color': 'white'});

これは別の要素がbodyかが含まれているかどうか動作します。

ここにはworking jsFiddleがあります。

また、HTMLではなく、htmlのhtml要素に小文字を使用する必要があります。

出典

2011-12-28 20:41:27

（CSS 'のためのマップ構文を使用する必要はありません）' sinice 1つだけを変更していますプロパティ。 – Purag

私は後でより多くのプロパティを追加するかもしれないので、単純にその構文を使用する傾向があります。したがって、コードベースをより保守性にする傾向があります。ただ個人的な好み。 –

これはおそらくそれが動作しなければならない方法です。 – Mechaflash

$("body.specialPage") 
    .closest("html") 
    .css("background-color","");

最初の行は、特別なクラスを持つbody要素を対象としています。次に、親のHTMLタグを選択し、その背景色を '削除'します。美しさは、クラスがあなたが探しているものに特別に設定されていない場合、親HTMLを選択しないということです。

また、これは動作します：

if($("body").hasClass("specialPage")){ 
    $("html").css("background-color",""); 
}

jQueryのhasClass()戻りブール（trueをそうでない場合、それはクラスとfalseを持っている場合）、そのbodyタグは、あなたが探しているクラスを持っていますif関数でコードを実行し、HTMLタグからバックグラウンドカラーを再度削除します。あなたが！重要な修飾子を持つHTMLタグから背景色のスタイルを上書きしようとすることができ

出典

2011-12-28 20:42:39 Purag

<HTML style="background-color:#666"> 
    <BODY class=specialPage style="background-color:#123 !important"> 
    </body> 
</html>

出典

2011-12-28 20:43:17 phil

これはおそらくスタイリングがJavaScriptで実際に起こるべきではないので、望ましい方法でしょう。 +1 –

私の質問に編集を作成しました。残りのデフォルトのスタイリングを除いてこれは機能します。 – Mechaflash

BODY要素の特定のクラスからHTML要素をターゲットにする方法

答えて

関連する問題