Вопрос о CSS в Internet Explorer

Question

У меня есть идея, которую, я думаю, можно реализовать.

В файле CSS мне нужно указать:

height: 50px;

Если браузер Internet Explorer, и

height: 45px;

, если браузер Chrome или Firefox.

Как я могу это сделать?

Answer 1

Специальный тег можно использовать, как показано ниже:

<style type="text/css" media="screen">
   .yourTag { weight: 45px; }
   /*Normal browsers*/
</style>

<!--[if IE]>
<style type="text/css" media="screen">
   /*IE*/
   .yourTag { weight: 50px; }
</style>
<![endif]-->

Примечание: IE понимает вес элемента с границами, а другие браузеры этого не делают.

Answer 2

Есть несколько способов добиться этого, так как довольно часто необходимо предоставлять альтернативные таблицы стилей для IE по сравнению с другими браузерами.

Однако важно отметить, что версия IE такжекритическое - разные версии IE могут иметь разные проблемы, поэтому вы должны соответственно ориентироваться на свои хаки.В частности, Microsoft недавно выпустила IE9, который значительно более совместим с другими браузерами, чем более ранние версии;вам почти наверняка не понадобится ваш взлом в IE9, поэтому вы должны быть осторожны, чтобы исключить его.

Если вы явно хотите нацелить IE - например, вам нужно обойти конкретную ошибку IE - тогда лучшийподход заключается в использовании Условные комментарии .Это специфическая для IE функция, которая позволяет вам указывать код, который выполняется только в IE, а также указывать версию (и) IE, в которой он будет выполняться.

Условные комментарии выглядят следующим образом:

<!--[if lt IE 9]><link rel="stylesheet" href="ie-specific-styles.css" /><![endif]-->

IE видит специальный код;все остальные браузеры воспринимают его как обычный HTML-комментарий и игнорируют его.

Подробнее о них можно узнать здесь: http://www.quirksmode.org/css/condcom.html

Я бы отметил, что много проблем с размером блокав IE вызваны неиспользованием действительного Doctype.Если ваш HTML-код приводит к тому, что браузер переключается в режим причуд, то вы получите проблемы, подобные этим, но правильным решением будет , а не , чтобы взломать ваши стили, пока он не заработает;правильное решение состоит в том, чтобы исправить HTML, чтобы браузер не переходил в режим причуд.Это должно привести к правильной работе блочной модели, и многие странные проблемы с компоновкой исчезнут.

Answer 3

Без указания версии IE, о которой вы говорите, сказать сложно. Вы можете использовать CSS-хак, но условные комментарии, как правило, лучше, потому что они более перспективны. Условные комментарии используются так:

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

Это выглядит как обычный комментарий в браузерах, отличных от IE, но IE будет интерпретировать его как код.

См .: http://msdn.microsoft.com/en-us/library/ms537512(v=vs.85).aspx

Answer 4

Вы можете использовать условный CSS с помощью

<!--[if IE 6]>
    According to the conditional comment this is Internet Explorer 6
<![endif]-->

Таким образом, есть способ проверить, является ли это Internet Explorer или нет.

Например, Условнотаблицы стилей против CSS хаков?Ответ: Ни один! .

Answer 5

Хотя это возможно, было бы лучше, прежде всего, убедиться, что вы устраняете все причины для разных CSS.Ваш документ HTML имеет DOCTYPE, чтобы IE находился в режиме стандартов?Если это так, то покажите нам конкретную ситуацию, когда вы думаете, что вам нужен другой CSS, потому что, скорее всего, есть лучшее решение.

Answer 6

    <script type = "text/javascript">
    function checkBrowser()
    {
      var browserName=navigator.appName; 
      if (browserName=="Netscape")
      { 
        //set height as 45px;
      }
      else 
      { 
        if (browserName=="Microsoft Internet Explorer")
        {
       //set height as 50px;
        }
     }    
}
</script>

Answer 7

Я сделал пару поисков и нашел их, проверьте, может быть полезно:

1. Ориентация только на FireFox с CSS

2. Можете ли вы настроить таргетинг на Google Chrome?(Да, вы можете)