Question

使用Drupal，主题的背景颜色分配给<HTML>元素。我正在为一个特定页面创建单独的print CSS，并希望在用户打印页面时仅删除此页面的背景颜色。 <HTML>元素没有类或id，但<BODY>元素没有。

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

有没有办法指定我想要<BODY>的父元素？或者根据<HTML>类

的某种方式定位<BODY>

编辑：

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

Answer 1

在jQuery中，您可以执行以下操作：

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

无论其他元素是否包含body，这都将有效。

这是working jsFiddle。

此外，您应该为html元素使用小写字母，html而不是HTML。

Answer 2

$("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标记中“删除”背景颜色。

Answer 3

您可以尝试使用！important修饰符覆盖HTML标记中的背景颜色样式..

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

如何从BODY元素的特定类中定位HTML元素

3 个答案: