Site de conception de normes WEB, la méthode principale est d'utiliser XHTML+CSS, la feuille de style CSS est essentielle. Pour créer un site Web conforme aux standards du Web, vous ne pouvez pas concevoir de belles pages sans connaître CSS.
En fait, tous les aspects de la présentation doivent être implémentés avec CSS. Nous avions l'habitude d'utiliser des tableaux pour le positionnement et la mise en page, mais nous devons maintenant utiliser DIV pour le positionnement et la mise en page. Il s'agit d'un changement de façon de penser qui, au début, est un peu inconfortable. Afin de profiter des « avantages » apportés par les normes, il vaut la peine d'abandonner certaines vieilles pratiques traditionnelles.
Appeler des feuilles de style en externe
Dans le passé, nous utilisions généralement les feuilles de style de deux manières :
Méthode page inline : La feuille de style est écrite directement dans la zone d’en-tête du code de la page. Quelque chose comme ça :
Voici le contenu cité : <style type="text/css"> <!-- body { background : blanc ; couleur : noir } --> </style> ; |
Méthode d'appel externe : écrivez la feuille de style dans un fichier .css séparé, puis appelez-la avec un code similaire au suivant dans la zone d'en-tête de la page.
Voici le contenu cité : <link rel="stylesheet" rev="stylesheet" href="css/style.css" type="text/css" media="all" /> |
Dans la conception conforme aux standards du web, nous utilisons la méthode d'appel externe. Les avantages sont évidents. Vous pouvez changer le style de la page sans modifier la page et modifier uniquement le fichier .css. Si toutes les pages appellent le même fichier de feuille de style, la modification d'un fichier de feuille de style peut modifier les styles de tous les fichiers.
Utilisez la méthode de la double table pour appeler la feuille de style afin d'afficher le code original de certains sites conformes aux normes. Vous pouvez voir les deux phrases suivantes lorsque la feuille de style est appelée :
Voici le contenu cité : <link rel="stylesheet" rev="stylesheet" href="css/style.css" type="text/css" media="all" /> <style type="text/css" media="all"> @import url( css/style01.css );</style> |
Pourquoi l'écrire deux fois ?
En fait, dans des circonstances normales, il suffit d'utiliser la méthode du lien externe (c'est-à-dire la première phrase). L'appel à double table que j'utilise ici n'est qu'un exemple. La commande "@import" permet de saisir la feuille de style. La commande "@import" n'est pas valide dans les navigateurs Netscape 4.0. En d'autres termes, lorsque vous souhaitez que certains effets soient masqués dans le navigateur Netscape 4.0 et affichés dans la version 4.0 ou supérieure ou dans d'autres navigateurs, vous pouvez utiliser la méthode de commande "@import" pour appeler la feuille de style.