Comment Ca Marche l'informatique ?
 
 Comment Ça Marche - Articles - Feuilles de style - Introduction
 Accueil
 Forums
 Astuces
 Guide d'achat
 
   
 
 
Livres Comment ça marche?
Tout sur le hardware PC
Tout sur la sécurité
Tout sur le webmastering
Présentation des trois premiers ouvrages de la collection CommentCaMarche.net
Page d'accueil
Ajouter aux favoris
Contribuer à cet article
Ecrire à Jean-Francois Pillou
Feuilles de style en cascade (CSS)
Les feuilles de style
Syntaxe des styles
Implantation des CSS
Classes et ID
Unités
Couleurs
Boîtes et bordures
Positionnement d'éléments
La liste des propriétés
Version 2.0.6
 
Feuilles de style - css Page précédente Page suivante Retour à la page d'accueil

Présentation des feuilles de style

Le concept de feuilles de style est apparu en 1996 avec la publication par le W3C d'une nouvelle recommandation intitulée « Cascading StyleSheets » (feuilles de style en cascade), notée CSS.

Le principe des feuilles de style consiste à regrouper dans un même document des caractéristiques de mise en forme associées à des groupes d'éléments. Il suffit de définir par un nom un ensemble de définitions et de caractéristiques de mise en forme, et de l'appeler pour l'appliquer à un texte. Il est ainsi possible de créer un groupe de titres en police Arial, de couleur verte et en italique.

Les feuilles de style ont été mises au point afin de compenser les manques du langage HTML en ce qui concerne la mise en page et la présentation. En effet, le HTML offre un certain nombre de balises permettant de mettre en page et de définir le style d'un texte, toutefois chaque élément possède son propre style, indépendamment des éléments qui l'entourent. Grâce aux feuilles de style, lorsque la charte graphique d'un site composé de plusieurs centaines de pages web doit être changée, il suffit de modifier la définition des feuilles de style en un seul endroit pour changer l'apparence du site tout entier !

Elles sont appellées « feuilles de style en cascade » (en anglais « Cascading Style Sheets ») car il est possible d'en définir plusieurs et que les styles peuvent être hérités en cascade.

Les feuilles de style permettent notamment :

  • d'obtenir une présentation homogène sur tout un site en faisant appel sur toutes les pages à une même définition de style ;
  • de permettre le changement de l'aspect d'un site complet entier par la seule modification de quelques lignes ;
  • une plus grande lisibilité du HTML, car les styles sont définis à part ;
  • des chargements de page plus rapides, pour les mêmes raisons que précédemment ;
  • un positionnement plus rigoureux des éléments.

CSS 2.0

Depuis le 12 mai 1998, la norme CSS 2.0 est le standard en vigueur. La norme CSS2 apporte un grand nombre de nouvelles fonctionnalités par rapport à la précédente norme (1.0), parmi lesquelles :

  • La prise en compte de la diversité de médias (écran, imprimante, braille, synthétiseur vocal, etc.) ;
  • L'ajout de propriétés auditives pour les aveugles et malvoyants ;
  • La manipulation de curseurs ;
  • La gestion des débordements et de la visibilité des éléments.

La compatibilité des navigateurs

Malgré l'existence de recommandations du W3C, les feuilles de style ne sont pas reconnues de la même façon par tous les navigateurs. Le premier navigateur à avoir intégré les feuilles de style est Microsoft Internet Explorer 3.0, puis l'utilisation des feuilles de style s'est généralisée avec les versions 4.0 et supérieures d'Internet Explorer et de Netscape Navigator.

Navigateurs supportant les feuilles de style :

  • Microsoft Internet Explorer 3.0 (partiellement)
  • Microsoft Internet Explorer 4.x
  • Microsoft Internet Explorer 5.x
  • Microsoft Internet Explorer 6.x
  • Netscape Navigator 4.x
  • Netscape Navigator 6.x
  • Netscape Navigator 7.x
  • Mozilla x.x
  • Firefox x.x
  • Opera 5.x
  • Opera 6.x
  • Opera 7.x
  • Camino 0.8x
  • Safari 1.xx

A voir aussi

Le site ZenGarden propose de tester la puissance des feuilles de style en permettant de choisir différents styles à appliquer pour un même contenu.


Page précédente Page suivante

  Ce document intitulé « Feuilles de style - Introduction » issu de Comment Ça Marche est mis à disposition sous les termes de la licence Creative Commons. Vous pouvez copier, modifier des copies de cette page, dans les conditions fixées par la licence, tant que cette note apparaît clairement.