Question

我需要在我的css中隐藏IE的背景元素。

这是css文件中的类

.navbar-header .nav #presentacion {
    background:url("../img/horiz-line.png") no-repeat scroll 108px 20px transparent;
    display: block;
    height: 20px;
    margin-top: 20px;
}

我想使用此方法，将CSS插入隐藏此部分的页面的head部分：

    <!--[if IE]>
          <style>
         .navbar-header .nav #presentacion {
         display: block;
         height: 20px;
         margin-top: 20px;
         background: none;}
    </style>
   <![endif]-->

它不起作用，后台仍然显示在IE中，我做错了什么？

Answer 1

IE 10 +不支持conditionnal风格。因此，您必须将此用于IE10 +：

<style>
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
    /* IE10+ styles */
  .navbar-header .nav #presentacion {
         display: block;
         height: 20px;
         margin-top: 20px;
         background: none;}
}
</style>

更多信息： How do I target only Internet Explorer 10 for certain situations like Internet Explorer-specific CSS or Internet Explorer-specific JavaScript code?

Answer 2

使用反向方法。将！IE类应用于要显示背景图像的类。这只能在非IE浏览器中呈现。

<!--[if !IE]> -->
    <style>
    .navbar-header .nav #presentacion {
    background:url("../img/horiz-line.png") no-repeat scroll 108px 20px transparent;
    display: block;
    height: 20px;
    margin-top: 20px;
    }
    </style>
<!-- <![endif]-->

Answer 3

也许您在通用样式表之前声明它，并且它被覆盖了。试试这个：

<!--[if IE]>
  <style>
    .navbar-header .nav #presentacion {
      display: block;
      height: 20px;
      margin-top: 20px;
      background: none !important;
    }
  </style>
<![endif]-->

Answer 4

 <!--[if IE]>
          <style>
         .navbar-header .nav #presentacion {
         display: block;
         height: 20px;
         margin-top: 20px;
         background-image: none !important;}
    </style>
   <![endif]-->

在IE中隐藏CSS元素

4 个答案: