La règle @import peut être insérée soit directement dans tout fichier (X)HTML, entre les balises <style> </style>, soit dans tout fichier CSS. Dans les deux cas la règle @import doit être la première règle déclarée, seule la règle @charset ou une autre règle @import peut être déclarée avant.
Vous pouvez constater que dans cet exemple l'ensemble du style est appliqué : la règle se trouvant dans le second fichier CSS externe, appelé depuis le premier, s'applique malgré le fait que la règle @import ne soit pas la première règle dans le code CSS, en effet la règle @charset est la seule à pourvoir valablement se trouver avant la règle @import.
<!
DOCTYPE
html
PUBLIC
"
-//W3C//DTD
XHTML
1.0
Strict//EN
"
"
http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd
"
>
<
html
xmlns
=
"
http://www.w3.org/1999/xhtml
"
xml
:
lang
=
"
fr
"
>
<
head
>
<
title
>
Exemple 10 : Utilisation de la règle @import valide associée à la règle @charset dans un
fichier CSS externe<
/
title
>
<
meta
http
-
equiv
=
"
Content-Type
"
content
=
"
text/html;
charset=ISO-8859-1
"
/
>
<
meta
http
-
equiv
=
"
Content-Style-Type
"
content
=
"
text/css
"
/
>
<
link
href
=
"
style1-ex10.css
"
type
=
"
text/css
"
rel
=
"
stylesheet
"
/
>
<
/
head
>
<
body
>
<
h1
>
Exemple 10 : Utilisation de la règle @import valide associée à la règle @charset dans un fichier
CSS externe
<
/
h1
>
<
h2
>
Règles valides : le style s'applique.
<
/
h2
>
<
ul
>
<
li
>
Voici une liste non ordonnée : ses éléments sont gérés par deux règles différentes. La première est
introduite par une règle se trouvant dans un fichier CSS externe ; la seconde est introduite par une
règle @import déclarée après une règle @charset mais avant la première règle dans ce fichier CSS externe.
<
/
li
>
<
li
>
La première règle attribut le type de puce 'square' (carré) et la couleur d'arrière plan gold.
<
/
li
>
<
li
>
La seconde règle attribut des marges de 50px entre chaque élément de liste ainsi qu'une couleur de police
indigo. Le titre h2 se voit aussi attribuer le style souligné.
<
/
li
>
<
/
ul
>
<
/
body
>
<
/
html
>
@charset
"
ISO-8859-15
"
;
@import
url
("
style2
-
ex
10
.
css
"
);
ul li {
list-style-type
:
square
;
background-color
:
#
ffd700
;/*
gold
*/
}
h2 {
text-decoration
:
underline
;
}
ul li {
margin
:
50px
0
;
color
:
#
4b0082
;/*
indigo
*/
}
Copyright © 2011 Christophe F. Aucune reproduction, même partielle, ne peut être faite de ce site et de l'ensemble de son contenu : textes, documents, images, etc sans l'autorisation expresse de l'auteur. Sinon vous encourez selon la loi jusqu'à 3 ans de prison et jusqu'à 300 000 Euros de dommages et intérêts. Cette page est déposée.