Feuille de style

nicolas -  
spyagent01 Messages postés 86 Statut Membre -
Bonjour,
Suite a la lecture de l'article N°218 de micro hebdo donnant l'adresse de votre site a propos des feuilles de style, j'aurais une question a poser, car je n'arrive pas à comprendre l'explication,

Article micro hebdo :

Les feuilles de style ou CSS sont de petit fichiers contenant des instruction de mise en page qui obeissent a une syntaxe aussi stricte que simple à comprendre www.commentcamarche.net/html4/css.php3

Redigez autant de feuilles de style que vous souhaitez. Nommez chaque fichier selon le schema suivant :

- ie60win.css pour la feuille de style adapté à internet explorer 6.0

- ie55mac.css pour celle adaptée a IE 5.5 sous MacOS ;

- nn47unx.css pour celle adaptée à netscape navigator 4 sous Unix etc. Regroupez les dans le soddiers styles creer a l'etape 1

Question :

Est ce qu'il faut uniquement creer un fichier vide .css ou un fichier telecharger a partir de votre site ?
A voir également:

1 réponse

spyagent01 Messages postés 86 Statut Membre 13
 
Bonjour,

Créez un fichier vide avec un traitement de texte aussi primaire que notepad et appelez le comme-vous-voulez.css

Le meilleur emplacement est à la racine de votre site (dans la directory de votre site et pas dans une sous directory)

Chacune de vos pages contiendra, dans son header (entre les balises <head> et </head> une ligne du type
<link rel="stylesheet" href="style.css" type="text/css"> ou
<link rel="stylesheet" href="../style.css" type="text/css"> ou
<link rel="stylesheet" href="../../style.css" type="text/css"> etc...
selon le niveau hiérarchique RELATIF de la page html dans l'arborescence des sous-directory de votre site.

Ce fichier contiendra des lignes à la syntaxe rigoureuse comme, par exemple :

#petit1 { color: #900; font-style: normal; font-weight: 500; font-size: 8pt; line-height: 14px; font-family: Arial, Helvetica, Geneva, Swiss, SunSans-Regular; word-spacing: 100%; letter-spacing: 80%; vertical-align: middle; margin: -2px 0px; padding: -2px 0px; border: none 0px }
.petit2 { color: #900; font-style: normal; font-weight: 500; font-size: 8pt; line-height: 14px; font-family: Arial, Helvetica, Geneva, Swiss, SunSans-Regular; word-spacing: 100%; letter-spacing: 80%; vertical-align: middle; margin: -2px 0px; padding: -2px 0px; border: none 0px }
.grand { color: #900; font-weight: bold; font-size: 20pt; font-family: Arial, Helvetica, Geneva, Swiss, SunSans-Regular; border: none }

#petit1 est un ID
.petit2 est une classe

les deux ont strictement le même contenu, c'est leur usage dans la page qui diffère un peu.

Enfin, dans votre page elle-même, entre les balises <body> et </body> vous écrirez, par exemple :
<p class="grand">Je sais maintenant me servir d'une css.</p>
<p class="petit2">Tout sur Commentcamarche.</p>

Dans l'exemple de Micro Hebdo, ils proposent de créer une feuille de style par type de navigateur/plateforme afin, surtout d'avoir une police de caractères plus grande pour les internautes Mac. Voir pourquoi ici :
http://terroirs.denfrance.free.fr/p/webmaster/probleme%20taille%20affichage%20mac%20pc.html

Il vous faudra alors écrire un peu de Java (a moins que leur exemple soit complet - je ne le connais pas) à recopier dans le header de chaque page de votre site pour tester le navigateur qui reçoit la page et prendre telle ou telle feuille de style selon le cas.

Tout le look de votre site est concentré en quelques lignes.

SpyAgent01
0