Какова правильная последовательность ссылок при замене @import из файла CSS - PullRequest
Новая
       21

Какова правильная последовательность ссылок при замене @import из файла CSS

0 голосов
/ 30 ноября 2011

У меня есть HTML веб-дизайн, сделанный кем-то другим; они использовали @import внутри CSS-файлов. Я буду по нескольким причинам (в первую очередь: http://www.stevesouders.com/blog/2009/04/09/dont-use-import/) удалить @import внутри файлов CSS и вместо этого напрямую включить его в html-страницу с помощью: <link rel="stylesheet"… >

Теперь у меня вопрос: как правильно добавить файлы по ссылке, чтобы поддерживать текущую последовательность проверки правил

Текущая последовательность @import, например ::100100 

a.css
  @import b.css

b.css
  @import c.css
  @import d.css

Будет ли правильный порядок ссылок: 

a.css
b.css
c.css
d.css

или это что-то вроде: 

c.css
d.css
b.css
a.css

или ???

Каждый файл содержит, кроме одного или нескольких тегов импорта, также собственные правила CSS.

Для справки: я не могу собрать все файлы в один файл - разные CSS-файлы используются в разных контекстах в одиночку и / или вместе

Ответы [ 2 ]

1 голос
/ 30 ноября 2011

Правило @import включает все правила стиля, как если бы они находились на этой позиции. Пример (default.css): 

@import "first.css";
@import "second.css";
@import "third.css";

body {
   color: #333333;
}

В этом порядке сначала будут применены все правила css для first.css, затем second.css, затем третий.css. Поэтому, если вы хотите удалить включение, просто перейдите по ссылкам на импорт и добавьте их в следующем порядке в разделе заголовка html: 

<head>
  <title>Whatever</title>
  <link href="first.css" rel="stylesheet" type="text/css">
  <link href="second.css" rel="stylesheet" type="text/css">
  <link href="third.css" rel="stylesheet" type="text/css">
  <link href="default.css" rel="stylesheet" type="text/css">
</head>

Итак, в вашем случае это будет: 

c.css
d.css
b.css
a.css
0 голосов
/ 30 ноября 2011

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

a.css
b.css
c.css
d.css

Отправьте ответ, если вы обнаружите, что это не так.

...