CSS если заявления ... это правильно? - PullRequest
Новая
       2

CSS если заявления ... это правильно?

6 голосов
/ 23 мая 2011

Я новичок с условным CSS.Мой вопрос: правильно ли использовать его для решения кросс-браузерных проблем?

Например: 

#header
{
    [if IE 7] width: 600px;
    [if Webkit] width:300px;    
}

Примечание редактора: OP скорее всего используетэто: http://www.conditional -css.com /

Ответы [ 4 ]

6 голосов
/ 23 мая 2011

Стало распространенным использование вариантов этой техники для IE, я думаю, что она стала популярной благодаря HTML5 Boilerplate [цитата нужна]: 

<!--[if lt IE 7]> <html lang="en-us" class="ie6"> <![endif]-->
<!--[if IE 7]>    <html lang="en-us" class="ie7"> <![endif]-->
<!--[if IE 8]>    <html lang="en-us" class="ie8"> <![endif]-->
<!--[if gt IE 8]><!--> <html lang="en-us"> <!--<![endif]-->

Теперь вы можете нацеливать элементы без IE-хаков в ваших основных CSS-файлах, например, так: 

.ie6 .header li {
    /* some ie6 only styles here */
}

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

Если у вас возникли проблемы с Webkit, вы, скорее всего, делаете что-то неправильно.Не Абсолютно, но это очень вероятно.

РЕДАКТИРОВАТЬ: Многие браузеры позволяют проприетарные расширения, которые позволяют вам устанавливать правила, которые будут применяться только к этому браузеру.Пример: 

-moz-property {}
-webkit-property {}
-o-property {/* Opera */}

Обратите внимание, что это не означает, что вы можете применить любое свойство CSS, вам нужно увидеть, что доступно.

Лучшая ссылка, которую я мог быстро найти: http://reference.sitepoint.com/css/vendorspecific

SO Редакторы, не стесняйтесь заменить эту ссылку, если есть лучшая ссылка

6 голосов
/ 23 мая 2011

Используйте условные операторы для реальных файлов CSS (или классов), но в HTML.

Как например: 

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

Это написано в файле html, а не в файле CSS!

Формат, который вы разместили, мне кажется, на самом деле не работает, и я уверен, что он не проверяется, поэтому он не является стандартным.

1 голос
/ 23 мая 2011

Что касается обоснованности ваших утверждений, у ДжекДжо есть хороший ответ. Но, как правило, это не очень хорошая практика. Что касается макета, то лучше получить хороший макет, который работает в разных браузерах и не мешает работе с браузером. Вместо этого беспокойтесь о специфических проблемах. Определенно бывают моменты, когда вы просто не можете исправить проблему с IE6, и в этот момент вам, вероятно, следует применить какой-то специфический для браузера код, чтобы не испытывать головную боль.

В общем, это просто не очень хорошая идея.

Примечание: Почему, во имя Тима Бернерса-Ли, вы все еще пытаетесь поддержать IE5?

0 голосов
/ 29 апреля 2014

Нет, это не так, Вы можете попробовать эти

Для IE 7 и 8:
width: 600px\9;
Для IE10:
width:300px\0/;

Для всех браузеров:
width: 600px;

Но если вы хотите использовать его во всех трех браузерах по отдельности IE, GC, FF, используйте его следующим образом
width:300px; width: 600px\9; width:300px\0/;
Я думаю, это то, что вы искали!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...