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