Директива @import или импорт css файла

Автор: Aport Пятница, Январь 23rd, 2015 Нет комментариев

Рубрика: Разное

Директива @import дает нам зеленый свет на включение в свою таблицу стилей других таблиц стилей. Она должна содержать URI(Universal Resource Identifier) или проще сказать ссылку на файл импортируемой таблицы стилей.

И не забывайте, если у Вас файл импортируется из директории, например mydir - @import url(«mydir/style.css»); и в нем прописан путь к рисунку, например: background-image: url(img/elements/bgstrip.gif); то путь теперь должен быть следующим background-image: url(../img/elements/bgstrip.gif); т.к.style.css теперь будет смотреть из под каталога mydir.

Хорошим тоном будет подписывать импортируемые файлы рядом, например так:

<style type=»text/css»>
@import url(«style.css»);/*Стили отображения главной таблицы*/
body{overflow: auto; background-color: #F5F5F5;}
</style>

В результате просмотра этой таблицы Вы поймете, как можно, и как нужно писать правильно эту директиву.

Browser IE
Win
Opera Mozilla FF Ko Saf IE
Mac
W3C CSS Validator
Rules 6 5.5 5.0 4 7 6 1.7+ 1.4 0.6+ 3.2 1.2 5.2 Y/N Err./Warn.
1 @import url(«style.css»); + + + + + + + + + + + + Yes
2 @import url(style.css); + + + + + + + + + + + + Yes
3 @import «style.css»; + + + - + + + + + + + + Yes
4 @import url(«style.css») all; - - - - + + + + + + + + Yes
5 @import url(«style.css»); - - - - + - + + + - - - Yes
6 @import url(«style.css»); - - - - + - + + + - - - Yes
7 @import url(«style.%63ss»); + + + + + + + + + + + + Yes
8 @import/**/»style.css»; + + - - + + + + + + + - Yes
9 @import «style.css»/**/; + - - - + + + + + + + - Yes
10 @import url(/**/»style.css»); + - - - - - + + + - - - Yes
11 @imp\6F rt url(«style.css»); + - - - - - + + + - - + Yes Warning
12 @import\**\»style.css»; - + - - - - - - - - - - Yes Warning
13 @im\port url(«style.css»); + - - - - - + + + - - + Yes Warning
14 @import\ url(«style.css»); - + + + - - - - - - - - Yes Warning
15 @import_url(«style.css»); - - + + - - - - - - - + Yes Warning
16 @import «style.css»;
Non-Breaking Space (Alt-0160) after @import
- + + - - - - - - - - - Yes Warning
17 @import «style.css»;
Non-Breaking Space (Alt-0160) before @import
+ + + - - - - - - - - - No Error
18 @import «style.css» ;
Non-Breaking Space (Alt-0160) before ;
+ + + - - - - - - - - - No Error
19 @import url («style.css»);
Non-Breaking Space (Alt-0160) after url
- + - - - - - - - - - - No Error
20 @import: url(«style.css»); + + + + - - - - No Error
21 @ import url(«style.css»); - + - - - - - - - - - - No Error
22 @import url («style.css»); + + - - - - - - - - - - No Error
23 @import style.css; + + + - - - - - - - - - No Error
24 _@import «style.css»; - - + - - - - - - - - - No Error
25 @import url(«style.css»)_; - - - - - - - + + - - - No Error
26 em{color:red};@import url(«style.css»); - + + + - - - - - - - - No Error
27 \@import url(«style.css»); - - + + - - - - - - - - No Error
28 @import url\ («style.css»); + - - - - - - - - - - - No Error
29 @import ur\6C («style.css»); + - - - - - + + + - - + No Error
30 @import(style.css); - - - - - - - - - - + No Error
31 @import url(«style.\63 ss»); + - - - + + + + + + + + No Error
[Bad Request]
32 @import url(«style.
css»);
+ + + + - - - - - - - - No Error
33 @import url(«style.\
css»);
+ - - - + + + + + - - + No Error
[Bad Request]

Таблица позаимствована с сайта: imfo.ru

 

Источник: yapro.ru

Оставить комментарий

Чтобы оставлять комментарии Вы должны быть авторизованы.

Похожие посты