0

如果用户的浏览器是 IE8,我正在尝试覆盖一些样式规则。在我的<!doctype html>我有这些规则:

<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7" lang="en"> <![endif]-->
<!--[if IE 7]>    <html class="no-js lt-ie9 lt-ie8" lang="en"> <![endif]-->
<!--[if IE 8]>    <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->

<html>它将在检测到 IE 浏览器后将定义的类添加到标签中。

我要定位的块有一个.social. 要为 IE8 覆盖 .social,在 .css 中使用的正确选择器是什么?我试过.social.no-js.lt-ie9, no-js.lt-ie9, 只是.no-js.lt-ie9. 我列出课程的顺序重要吗?如果这些类不是彼此的直接后代,这有关系吗?我所做的一切似乎都没有覆盖 IE8 中的实际 .social 。有什么提示吗?

以下是我到目前为止所拥有的...

.social {
    background: url('../images/thanks-paper.png') no-repeat 0 0;
    height: 540px;
    margin: 10px 0 40px -333px;
    padding: 0 0 0 310px;
    position:relative;
}

.no-js.lt-ie9.social {
  background:url('../images/thanks-paper.png') no-repeat 0 0;
  height:540px;
  margin:10px 0 40px -400px;
  padding-bottom:0;
  padding-left:382px;
  padding-right:0;
  left:8px;
  position:relative;
}

这是页面当前的设置方式...

<html class="no-js lt-ie9" lang="en">
  <head> ... </head> 
    <body> ... 
      <div class="social"> ... </div>
    </body>
</html>
4

1 回答 1

1

使用它来定位 IE8 及以下版本:

.lt-ie9 .social {
    margin-left: -400px;
    padding-left:382px;
    left:8px;
}

该类应该与Modernizr.no-js之类的库一起使用。通过使用 javascript 删除类,它可以指示是否启用了 JS。您可以使用您的 CSS 来定位禁用javascript 的浏览器。.no-js

另外,请注意类之间的空格。当编写的类没有空格(如.lt-ie9.social)时,您实际上是在尝试寻找具有所有这些类的元素。.no-js.lt-ie9.social试图为这些类中的每一个找到一个元素也是如此。

于 2013-09-30T19:58:17.607 回答