CSS-импорт или <link rel ...> с атрибутом «media» - PullRequest
Новая
       2

CSS-импорт или <link rel ...> с атрибутом «media»

7 голосов
/ 26 января 2011

Какой лучший способ включить CSS на страницу и почему?

например: 

<style type="text/css">
  @import "style.css" screen, tv;
  @import "print.css" print;
  @import "iphone.css" iphone;
</style>

или 

<LINK rel="stylesheet" media="screen" href="style.css" type="text/css" />
<LINK rel="stylesheet" media="print" href="print.css" type="text/css" />
<LINK rel="stylesheet" media="iphone" href="iphone.css" type="text/css" />

Из того, что я знаю @import не работает в древних браузерах, это может быть преимуществом, потому что эти браузеры будут показывать только текст вместо нечитаемого беспорядка CSS (при использовании ссылки).

Ответы [ 2 ]

7 голосов
/ 26 января 2011

Это обсуждалось много раз, вы можете прочитать больше здесь:

http://www.stevesouders.com/blog/2009/04/09/dont-use-import/

Разница между @import и ссылкой в ​​CSS

http://webdesign.about.com/od/beginningcss/f/css_import_link.htm

упомянуть некоторые ...

Лично я никогда не использую @import для снижения производительности.

2 голосов
/ 26 января 2011

Реально оба достигают одной и той же цели, но есть несколько незначительных отличий.А именно:

  1. @ import не поддерживается в IE6 и более ранних версиях, а Netscape 4
  2. @ import позволяет импортировать несколько таблиц стилей в одну ссылку или элемент стиля, если необходимо
  3. ссылка позволяет указать альтернативную таблицу стилей, на которую могут переключаться браузеры, такие как FireFox, Safari и Opera.IE также поддерживает это, если используется переключатель JavaScript.Это чаще всего используется для доступности.
...