Reguła @import w CSS

  • Poprzednia strona
  • Następna strona

Definicja i zastosowanie

Reguła @import pozwala zaimportować arkusz stylów do innego arkusza stylów.

Reguła @import musi znajdować się na początku dokumentu (ale po jakimkolwiek deklaracji @charset).

Reguła @import obsługuje zapytania media, więc można zezwolić na zaimportowanie zależne od medium.

Przykład

Przykład 1

Zaimportuj arkusz stylów "navigation.css" do bieżącego arkusza stylów:

@import "navigation.css"; /* Użyj ciągu znaków */

lub

@import url("navigation.css"); /* Użyj URL */

Przykład 2

Zaimportuj arkusz stylów "printstyle.css", gdy medium to druk:

@import "printstyle.css" print;

Spróbuj sam

Przykład 3

Zaimportuj arkusz stylów "mobstyle.css", gdy medium to ekran i szerokość ekranu wynosi maksymalnie 768 pikseli:

@import "mobstyle.css" screen and (max-width: 768px);

Spróbuj sam

gramatyka CSS

@import url|string list-of-mediaqueries;

wartość atrybutu

wartość opis
url|string adres URL lub ciąg znaków, reprezentujący lokalizację zasobu do zaimportowania. Adres URL może być bezwzględny lub względny.
list-of-mediaqueries Lista zapytań media rozdzielonych przecinkami, która określa, w jakich warunkach mają być zastosowane zasady CSS zaimportowane przez URL.

Wspierane przez przeglądarki

Liczby w tabeli wskazują na pierwszą wersję przeglądarki, która obsługuje ten atrybut w pełni.

Chrome IE / Edge Firefox Safari Opera
1.0 5.5 1.0 1.0 3.5
  • Poprzednia strona
  • Następna strona