Les feuilles de style avec KompoZer

Où se cachent les styles ?

Le code HTML est une structure relativement simple qui ne contient que du texte brut. Comment une couleur de caractères ou une couleur de fond peuvent-elles être indiquées dans ce texte?

Un coup d'oeil en coulisses

L'ensemble des codes nécessaires aux mises en formes se trouvent dans la page web.
  • Vérifie que la page test.html est toujours ouvert. Si nécessaire, ouvre-la ou active l'onglet correspondant.
  • Active l'onglet Source de la page test.html.
  • Dans cette page, repère les modifications opérées depuis la définition des mises en formes des éléments h1, h2 et body.

L'ensemble est inclus dans une zone limitée par les deux balises style.

Styles

Quelques tests

Pour bien comprendre comment fonctionnent les règles de style, procéddons à quelques essais.

  • Modifie color: red en color: blue pour la balise h1
  • Retourne dans l'onglet Normal et visualise le résultat obtenu.
  • Modifie color: green en color: red pour la balise h2
  • Peux-tu prévoir le résultat?
  • Modifie finalement background-color: fuchsia en background-color: blue pour la balise body
  • Vérifie que le résultat est conforme à ce que tu attendais.
Quel serait, à ton avis, l'effet de la règle cite{color : green} si on l'introduisait dans ton document de travail?
Aucun effet.
Le document serait entouré d'un cadre vert.
Le fond de la page prendrait la couleur verte.
La citation de Samule Beckett prendrait la couleur verte.
Un bug connu de KompoZer peut provoquer la désactivation de certaines fonctions puis un arrêt brutal du logiciel lorsque l'on opère des modifications dans l'onglet Source. Pense à enregistrer souvent.

Quand tu as terminé les tests et que tu es capable de prévoir les résultats des modifications dans les règles de styles, passe à la page suivante. Page suivante


Dernière modification 14/10/2007
Ecrire