Repères
Profil
Technologie
Thème
Technologie : CSS
Openweb.eu.org > Technologie : CSS
Passer aux feuilles de style
Vous utilisiez les balises HTML de présentation ? Pour tirer parti des avantages offerts par les standards, découvrez le vocabulaire élémentaire des feuilles de style.
Les bénéfices des standards par un graphiste Web
Ned Baldessin, professionnel du Web, nous présente le point de vue des graphistes sur les différentes technologies qui forment les standards de l’Internet.
Habillage de tableaux avec des CSS
Faire des tableaux de données accessibles et respectant les standards avec les CSS
Bouton CSS
Pour créer un bouton changeant d’aspect au passage de la souris, on peut utiliser les styles légers et accessibles.
Utilisation des images dans les CSS
Comment utiliser une feuille de style pour insérer dans le contenu HTML des images décoratives.
Initiation au positionnement CSS : 3. position absolue et fixe
La position absolue et la position fixe permettent de placer une boîte par rapport aux limites de la zone d’affichage ou du conteneur. Comment les utiliser dans une mise en page CSS ?
Initiation au positionnement CSS : 1.flux et position relative
Par défaut, les navigateurs affichent les boîtes issues du document html dans l’ordre du flux normal. En position relative, un élément peut être décalé verticalement et/ou horizontalement.
Overflow avec fond fixe en CSS
Comment créer en CSS un overflow avec une image de fond fixée dans le bloc défilant ?
Initiation au centrage CSS
Les différentes méthodes de centrage d’un contenu HTML.
Initiation au positionnement CSS : 2.position float
La position float retire une boîte du flux normal pour la placer le plus à droite ou le plus gauche possible dans son conteneur. Comment l’utiliser dans une mise en page CSS ?
Les CSS désormais supportées par les navigateurs modernes sont l’outil de présentation des pages Web standards.
A la différence des méthodes employées dans les années 90, les CSS permettent une stricte séparation du contenu HTML et des informations de mise en page. Le gain réalisé est considérable :
- gestion simplifiée et économique de la présentation d’un site à l’aide d’une seule feuille de style pour toutes les pages, aisément modifiable ;
- allègement des coûts de développement et de maintenance : il n’est plus nécessaire de mettre en place un système (hasardeux) de discrimination des navigateurs pour servir aux différents navigateurs un document adapté aux technologies propriétaires qui balkanisent le Web ;
- allègement du code-source des pages Web, et donc économie de bande passante : une feuille de style n’est chargée qu’une fois par un navigateur, qui l’applique sans délai si nécessaire aux pages visitées par la suite ;
- possibilité de doter une page de feuilles de style spécifiques selon les medias (navigateurs graphiques, lecteurs d’écran…). Les feuilles de style
print
permettent une impression immédiate d’une page depuis le navigateur, et dispensent d’avoir à créer une version imprimable du documentHTML
; - possibilité de doter une page de présentations alternatives au choix de l’utilisateur ;
- création de layout flexibles, qui s’adaptent aux différentes résolutions d’écran ;
- meilleure accessibilité des pages Web par la disparition des tableaux détournés à des fins de présentation.