Les feuilles de style avec KompoZer

pdfCette page en PDF

Préparer un document de travail

Dites, ça m'a l'air plutôt compliqué, ce code HTML. J'ai un peu peur de m'y perdre. On ne pourrait pas simplifier un peu tout ça, pour le début ?

Effectivement, c'est sans aucun doute une bonne idée. C'est la raison pour laquelle je propose de travailler sur un document très simple dont le code HTML figure ci-dessous.

  • Ouvre un nouveau document dans KompoZer.
  • Sur cette page blanche, ouvre le mode Mixte par la méthode que tu préfères.

Dans la zone du code HTML, une seule balise est visible: <br>.

  • Supprime la balise <br> existante.
  • Fais un copier/coller du code HTML ci-dessous vers la zone de code, dans KompoZer.
    • Clique gauche dans la zone: tout le texte est automatiquement sélectionné.
    • Ensuite clique droit et sélectionne la commande Copier dans le menu contextuel.
    • Finalement, colle le texte dans la zone de code de KompoZer.
  • Retourne en mode Conception et observe le résultat.

Ouah ! C'est magique, ou bien ? Voilà que je colle un texte tout en caractères " normaux " et aussi sec KompoZer me met des choses en grands caractères ou en petits caractères... Chuis bluffé, là !

Magique ? Je ne crois pas. Nous essayerons d'expliquer cela à la page suivante. Tout est évidemment dans les balises HTML qui parsèment le texte.

  • Enregistre le document sous le nom test.html; le titre à donner à la page est "Document sans titre".
  • Clique sur l'onglet Source pour voir l'ensemble du code HTML de la page.

Le texte de l'ensemble de la page (un peu réorganisé pour faciliter la lecture) se présente comme suit*:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">
  <title>Document sans titre</title>
</head>
<body>
  <h1>Ceci est le titre principal</h1>
    <h2>Titre secondaire n°1</h2>
      <p>Ceci est le premier paragraphe</p>
    <h2>Titre secondaire n°2</h2>
      <p>Ceci est le texte du deuxième paragraphe</p>
      <cite>Nous naissons tous fous.<br>
      Quelques-uns le demeurent. (Samuel Beckett, 1906-1989)
      </cite>
</body>
</html>

* Selon la configuration de KompoZer, il se pourrait que le code soit légèrement différent chez toi.

Mais c'est encore pire que ce que je pensais. On a vraiment besoin de tous ces codes incompréhensibles?

Nous n'en avons pas besoin. Mais les logiciels utilisés pour naviguer sur le web utilisent toutes ces informations. C'est leur travail que d'interpréter tout cela.

Quand le texte est composé et enregistré, passe à la page suivante.Vers la page suivante Page suivante


Dernière modification 13/03/2010