IE特定的CSS无法呈现

Question

有人可以帮我为什么IE特定CSS无法在IE上运行吗？

这是实时网站的链接： http : //www.themebia.com/pretavivre/

我正在尝试修复IE中的顶级导航栏。 导航栏在Chrome和FF中看起来不错，但在IE中看起来不太好。

我在html头中为IE添加了以下CSS修复选项。

<!--[if IE]>
            <link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_directory')?>/css/ie.css"/>
        <![endif]-->

ie.css在head元素中正确链接，但是css在IE中不起作用。

您可以使用http://www.themebia.com/pretavivre/wp-content/themes/pretAvivre/css/ie.css来访问ie.css 。

注意：我已经为IE添加了萤火虫，您必须右键单击检查元素。

Answer 1

目标IE 10
http://suhasrathod.wordpress.com/2013/04/29/ie10-css-hacks/

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { #yourDiv {margin-left:-570px;} }

Answer 2

您正在使用哪个IE版本？

从IE5到IE9（包括IE）都支持条件注释，因此它们在IE10，IE11中不起作用。

关于更多

Answer 3

您正在使用哪个版本的ie？ 如果您在ie8上进行测试，很抱歉告诉您ie8和更早版本不支持：last-child。

Answer 4

只是一个猜测，但是您似乎正在加载IE CSS ，而不是其余所有CSS。 该链接似乎有效，但是我假设您的CSS的其余部分将覆盖您为IE加载的已声明的CSS。

解决方法是将IE CSS文件移动到最后加载的CSS文件。

Answer 5

你错过了; 在您的bloginfo()的末尾。 但是，Wordpress Codex建议使用get_stylesheet_directory_uri(); 而不是bloginfo('stylesheet_directory'); 。

尝试这个：

<!--[if IE]>
<link rel="stylesheet" type="text/css" href="<?php echo get_stylesheet_directory_uri();?>/css/ie.css"/>
<![endif]-->

Answer 6

请注意，IE 10及更高版本完全不支持条件注释。

定位到IE的所有版本

<!--[if IE]>
    <link rel="stylesheet" type="text/css" href="all-ie-only.css" />
<![endif]-->

定位除IE之外的所有内容

<!--[if !IE]><!-->
    <link rel="stylesheet" type="text/css" href="not-ie.css" />
 <!--<![endif]-->

仅目标IE 7

<!--[if IE 7]>
    <link rel="stylesheet" type="text/css" href="ie7.css">
<![endif]-->

仅目标IE 6

<!--[if IE 6]>
    <link rel="stylesheet" type="text/css" href="ie6.css" />
<![endif]-->

仅针对IE 5

<!--[if IE 5]>
    <link rel="stylesheet" type="text/css" href="ie5.css" />
<![endif]-->

仅目标IE 5.5

<!--[if IE 5.5000]>
<link rel="stylesheet" type="text/css" href="ie55.css" />
<![endif]-->

目标IE 6和更低

<!--[if lt IE 7]>
    <link rel="stylesheet" type="text/css" href="ie6-and-down.css" />
<![endif]-->

<!--[if lte IE 6]>
    <link rel="stylesheet" type="text/css" href="ie6-and-down.css" />
<![endif]-->

目标IE 7和更低

<!--[if lt IE 8]>
    <link rel="stylesheet" type="text/css" href="ie7-and-down.css" />
<![endif]-->

<!--[if lte IE 7]>
    <link rel="stylesheet" type="text/css" href="ie7-and-down.css" />
<![endif]-->

目标IE 8和更低

<!--[if lt IE 9]>
    <link rel="stylesheet" type="text/css" href="ie8-and-down.css" />
<![endif]-->

<!--[if lte IE 8]>
    <link rel="stylesheet" type="text/css" href="ie8-and-down.css" />
<![endif]-->

目标IE 6和更高版本

<!--[if gt IE 5.5]>
    <link rel="stylesheet" type="text/css" href="ie6-and-up.css" />
<![endif]-->

<!--[if gte IE 6]>
    <link rel="stylesheet" type="text/css" href="ie6-and-up.css" />
<![endif]-->

目标IE 7和更高版本

<!--[if gt IE 6]>
    <link rel="stylesheet" type="text/css" href="ie7-and-up.css" />
<![endif]-->

<!--[if gte IE 7]>
    <link rel="stylesheet" type="text/css" href="ie7-and-up.css" />
<![endif]-->

目标IE 8和更高版本

<!--[if gt IE 7]>
    <link rel="stylesheet" type="text/css" href="ie8-and-up.css" />
<![endif]-->

<!--[if gte IE 8]>
    <link rel="stylesheet" type="text/css" href="ie8-and-up.css" />
<![endif]-->

通用IE 6 CSS

<!--[if !IE 6]><!-->
  <link rel="stylesheet" type="text/css" media="screen, projection" href="REGULAR-STYLESHEET.css" />
<!--<![endif]-->

<!--[if gte IE 7]>
  <link rel="stylesheet" type="text/css" media="screen, projection" href="REGULAR-STYLESHEET.css" />
<![endif]-->

<!--[if lte IE 6]>
  <link rel="stylesheet" type="text/css" media="screen, projection" href="http://universal-ie6-css.googlecode.com/files/ie6.0.3.css" />
<![endif]-->

资源

Answer 7

在style.css中

改变这个

ul#menu-showroom {

  margin:0;

  padding:2px 0 !important;

}

请让我知道它是否适用于上方导航栏

Answer 8

我绝对讨厌IE，特别是版本6、7和8。在设计wordpress主题时，您必须为其设置两次样式，一次是为适当的浏览器设置样式，然后是IE古代版本。 要记住的另一件大事是，这些远古人不支持媒体查询。

因此，要解决您的问题，请创建一个名为ie.css的样式表。 您将使用它来完成IE 7和8的所有样式。

接下来，您将需要排队该样式表，但是我们将有条件地将其排队。 此样式表仅适用于IE8以下的IE版本。 因此，在您的functions.php中，添加以下内容

function enqueque_ie_stylesheet() {
// Load the Internet Explorer specific.  stylesheet.
 wp_enqueue_style( 'style-ie',   get_template_directory_uri() . '/ie.css',   array(), '' );
    wp_style_add_data( 'style-ie', 'conditional', 'lt IE 9' );
 }
add_action( 'wp_enqueue_scripts', 'enqueue_ie_stylesheet' );

现在，您可以在ie.css添加样式。 如果使用子主题，请记住将get_template_directory_uri更改为get_stylesheet_directory_uri