czwartek,
Importowanie arkuszy stylów
Jednym ze sposobów dołączania deklaracji CSS do strony internetowej jest import arkuszy stylów.
Dołączany arkusz
W dołączanym pliku zadeklarowano kolor tekstu w akapitach. Otrzymał on nazwę colors.css.
p {
color: green;
}
Import z poziomu osadzonych stylów
Jedną z możliwości importowania arkusza stylów jest zastosowanie stylów osadzonych. Deklaracje z pliku colors.css interpretowane są tak, jakby zostały wpisane w tym miejscu.
<style>
@import url(colors.css);
p {font-family: sans-serif;}
</style>
Import z poziomu zewnętrznych stylów
Arkusz stylów może być zaimportowany z poziomu zewnętrznego pliku CSS dołączonego do dokumentu z pomocą znacznika link, jest realizowane podobnie, jak w przypadku stylów osadzonych. Przykładowa zawartość takiego pliku CSS:
@import url(colors.css);
p {
font-family: sans-serif;
}
Ważne reguły
Importując arkusze stylów, należy znać kilka zasad:
- można importować kilka plików, jednak trzeba wtedy dla każdego z nich podać osobną deklarację @import;
- polecenia importu muszą się znajdować zaraz na początku arkusza stylów, przed innymi deklaracjami (wyjątkiem jest deklaracja @charset);
- ścieżka do importowanego pliku powinna być napisana względem położenia arkusza CSS, w którym jest wstawione polecenie @import;
- importowane reguły CSS mają taki sam priorytet ważności, jak arkusz z poleceniem importu;
- w importowanym pliku można zamieszczać kolejne polecenia @import, tworząc w ten sposób kilka poziomów zagnieżdżeń, niektóre przeglądarki mogą mieć problem ze zbyt dużym zagłębieniem;
- w przypadku importowania arkuszy przeglądarki mogą działać wolniej, ponieważ muszą przetworzyć bardziej złożoną strukturę.
