Cours de HTML - Modèles de documents et de codes

version 1.12, dernière mise à jour le 24 octobre 2008.

  

Table des matières (TdM)

  1. I. Modèles de documents
    1. Introduction
    2. Modèle de document HTML strict
    3. Modèle de document HTML transitionnel
    4. Modèle de document HTML à cadres
  1. II. Modèles de codes
    1. Mise en forme de texte
      1. Paragraphes et titres
      2. Balises div et span
      3. La balise <font>
    2. Les liens

Retour au menu

Contenu du cours

I. Modèles de documents

1. Introduction

Cette partie présente des modèles de documents-types. Il va de soi que ces modèles doivent être complétés. Ils donnent les bases pour fournir des documents pouvant être traités par le validateur du W3C.

>Retour à la TdM

2. Modèle de document HTML strict

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!-- Déclaration de type de document. -->
<html lang="fr">
  <head>
    <!-- Déclaration du codage de caractères -->
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <title>(...)</title>
  </head>
  <body>(...)</body>
</html>

>Retour à la TdM

3. Modèle de document HTML transitionnel

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!-- Déclaration de type de document. -->
<html lang="fr">
  <head>
    <!-- Déclaration du codage de caractères -->
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <title>(...)</title>
  </head>
  <body>(...)</body>
</html>

>Retour à la TdM

4. Modèle de document HTML à cadres

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<!-- Déclaration de type de document. -->
<html lang="fr">
  <head>
    <!-- Déclaration du codage de caractères -->
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <title>(...)</title>
  </head>
  <body>(...)</body>
</html>

>Retour à la TdM

II. Modèles de codes

1. Mise en forme de texte

a. Paragraphes et titres

Voici par exemple un paragraphe précédé d'un titre ; ces éléments sont des enfants directs de la balise <body>.

<h3>Titre de niveau 3</h3>
<p>Petit paragraphe, avec un<br>
retour à la ligne.</p>

>Retour à la TdM

b. Balises div et span

La balise <div> est un enfant direct de <body>, la balise <span> est à l'intérieur d'un texte :

<body>
  <div id="premierdiv">
    <p>Un paragraphe avec un <span>élément span</span>.</p>
  </div>
  <div id="seconddiv">
    <p>Un deuxième paragraphe.</p>
  </div>
</body>

>Retour à la TdM

c. La balise <font>

Cette balise est obsolète.

<font face="Verdana, Arial, Helvetica, sans-serif" size="5" color="red">mon exemple.</font>

>Retour à la TdM

2. Les liens

Les liens peuvent être de trois types : interne, relatif, absolu.

<!-- Lien interne -->
<p>Paragraphe avec un <a href="#verslancre">lien interne</a>.</p>
<!-- Lien relatif -->
<p>Paragraphe avec un <a href="../index.html">lien relatif</a> vers un fichier du répertoire parent.</p>
<!-- Lien absolu -->
<p>Paragraphe avec un <a href="http://www.upmc.fr/">lien absolu</a>.</p>

>Retour à la TdM

Historique de ce document

Conditions d'utilisation et licence

Creative Commons License
Cette création est mise à disposition par Gilles Chagnon sous un contrat Creative Commons.

Retour au menu