Возможно ли иметь отдельные таблицы стилей CSS, которые автоматически загружаются в зависимости от того, из какого браузера осуществляется доступ к веб-сайту? - PullRequest
Новая
       16

Возможно ли иметь отдельные таблицы стилей CSS, которые автоматически загружаются в зависимости от того, из какого браузера осуществляется доступ к веб-сайту?

3 голосов
/ 11 марта 2012

Причина, по которой я спрашиваю, состоит в том, что я закончил прекрасный дизайн домашней страницы и только просматривал веб-сайт в Chrome и Safari на OSX, затем решил открыть Firefox, и некоторые вещи сломались.

Кроме того, у меня возникла проблема с отображением неправильного цвета заполнителя поля поиска, который отображал правильный цвет, указанный в таблице стилей в Firefox.

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

Также был бы отличным инструментом для просмотра моего сайта в нескольких браузерах вручную.

Ответы [ 3 ]

1 голос
/ 12 марта 2012

Некоторые люди предпочитают подходить к этому по-другому, используя файл сброса CSS .По сути, это устанавливает нейтральную отправную точку, так что любой применяемый вами CSS будет иметь одинаковый, предсказуемый результат во всех браузерах.

Одна из самых простых версий, которая даст вам общее представление о концепции, заключается в следующем:: 

* {
     padding:0;
     margin:0;
   }

В ответах на этот вопрос SO * много спорят об этом .

И вот сводка ссылок к различным распространенным подходам.

Редактировать : для тестирования в различных браузерах, проверьте этот популярный вопрос SO и этот .

0 голосов
/ 12 марта 2012

Если вы используете javascript, вы можете поместить этот фрагмент кода в тег head для обнаружения пользовательского агента 

<script type="text/javascript">
var browser={
    msie:navigator.userAgent.indexOf('MSIE') > -1 ? true : false,
    chrome:navigator.userAgent.indexOf('Chrome') > -1 ? true : false,
    opera:navigator.userAgent.indexOf('Opera') > -1 ? true : false,
    firefox:navigator.userAgent.indexOf('Firefox') > -1 ? true : false
}
if(browser.msie) document.write("<link REL='stylesheet' HREF='msie.css' TYPE='text/css'>");
if(browser.chrome) document.write("<link REL='stylesheet' HREF='chrome.css' TYPE='text/css'>");
if(browser.opera) document.write("<link REL='stylesheet' HREF='opera.css' TYPE='text/css'>");
if(browser.firefox) document.write("<link REL='stylesheet' HREF='firefox.css' TYPE='text/css'>");
</script>
0 голосов
/ 11 марта 2012

Так как обычно проблемы с IE, есть решение для этого.
Следующая строка, которую вы можете поместить в теги head, загрузит определенный CSS, только если вы используете IE7 

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

Тот же подход для других IE.

...