Alain Barraud Mémento informatique  
 
Accueil Logithèque - SE Photo - vidéo Internet - protocoles Site Web PC - Réseau Archives
RETOUR SOMMAIRE
Le texte
Le texte à afficher est à saisir dans le conteneur <body>.

  1. Espaces - Sauts de ligne - Paragraphes
  2. Pas de retour à la ligne
  3. Titres et sous-titres
  4. Lignes horizontales
  5. La balise <div>
  6. La balise <blockquote>
  7. Texte préformaté
  1. Espaces - Sauts de ligne - Paragraphes
    Quand on saisit du texte dans le Bloc-notes et qu'on l'affiche ensuite dans le navigateur, on constate que les espaces et les retours à la ligne ne sont pas respectés.
    • Espaces : les espaces ne sont pas respectés, on peut en mettre 5, un seul sera pris en compte. Pour obtenir le nombre d'espaces désirés, on utilise un élément spécial: &nbsp; (no breaking space).
      A chaque fois que le navigateur rencontrera cet élément, il laissera un espace.
      Exemple: pour laisser la valeur de 3 espaces, saisir: &nbsp;&nbsp;&nbsp;.
    • Sauts de ligne : pour forcer le retour à la ligne, il faut utiliser le marqueur <br> (break row).
      Attribut de <br>: clear. Valeurs : left, right, all permettant d'insérer un retour à la ligne dès que la marge (gauche, droite, ou les deux) est libre.
    • Paragraphe : la balise <p> marque le début d'un paragraphe. Se caractérise par 2 sauts de ligne. Cette balise est de type conteneur, mais il est à noter que la balise de fermeture </p> est facultative.
      Attribut de <p>: align (alignement horizontal). Valeurs:
      - left : aligne le texte sur la marge de gauche
      - right : aligne le texte sur la marge de droite
      - center : centre le texte entre les marges
      - justify : justifie le texte

      Note : l'attribut nowrap permet de ne pas effectuer de retour à la ligne.

  2. Pas de retour à la ligne
    Tout le texte compris entre les balises <nobr> et </nobr> ne contiendra pas de passages à la ligne intempestifs, à utiliser avec parcimonie car le visiteur sera peut être oblig> de faire défiler horizontalement la fenêtre de son navigateur, ce qui n'est pas très agréable.

  3. Titres et sous-titres
    Rien à voir avec le titre qui s'affiche dans le navigateur et qui est saisi dans la balise <TITLE>
    Il s'agit des titres et sous-titres que l'on trouve dans le texte de la page
    Il existe 6 niveaux de titres différents, le 1 étant le plus gros et le 6 le plus petit.
    Pour les écrire, on utilise la balise conteneur <h1 >, <h2 >, <h3>, <h4>, <h5> ou <h6> suivant la taille.
    Attribut des balises titres : align . Valeurs : right, left, center
    • <h1> TITRE DE NIVEAU 1 </h1>

      TITRE DE NIVEAU 1

    • <h2> TITRE DE NIVEAU 2 </h2>

      TITRE DE NIVEAU 2

    • <h3> TITRE DE NIVEAU 3 </h3>

      TITRE DE NIVEAU 3

    • <h4> TITRE DE NIVEAU 4 </h4>

      TITRE DE NIVEAU 4

    • <h5> TITRE DE NIVEAU 5 </h5>
      TITRE DE NIVEAU 5
    • <h6> TITRE DE NIVEAU 6 </h6>
      TITRE DE NIVEAU 6
  4. Lignes horizontales
    La balise <hr> (Horizontal Row) de type marqueur, permet de tracer une ligne horizontale.
    Attributs:
    • align. Alignement horizontal. Valeurs: left, center (par défaut), right.
    • width. largeur de la ligne. Valeur: en pixel ou % de la fenêtre.
    • size. Epaisseur de la ligne. Valeur: de 1 à 10.
    • noshade. Pas d'ombre. Pas de valeur, sa présence annule l'effet d'ombre (3d).
    • color. Pour spécifier la couleur (uniquement I.Explorer).
    Exemple: <hr width=200 color="blue" size=4 align=center>

  5. La balise <div>
    La balise <div> (de type conteneur) permet de créer une division de plusieurs élements.
    Ces élements peuvent être du texte, des images, des tableaux, des filets ou même des divisions.
    On peut ensuite aligner cette divison sur le document, grâce à son unique attribut : align. C'est d'ailleurs le seul moyen de center une image.
    Valeurs de align : right, left, center, justify.
    Exemple 1 pour du texte : <div align="center">Texte centré avec la balise <div></div>
    Texte centré avec la balise <div>

    Exemple 2 pour une image : <div align="center"><img src="images/htmlalain.gif"></div>

    A noter que depuis la version 4.0 du HTML, la balise <div> se diversifie, en effet elle accepte l'attribut style (feuilles de styles). Exemple : <div style="color:green">
    Mais la balise < DIV > ne s'arrête pas là. En effet, c'est un élement essentiel de la technologie du Dynamic HTML, du moins pour Microsoft Internet Explorer.

  6. La balise <blockquote>
    Balise de type conteneur. Elle permet de réaliser une indentation du texte par rapport à la marge gauche et à la marge droite.

  7. Texte préformaté
    Balise de type conteneur.
    Si jamais on veut vraiment écrire du texte en respectant la mise en page pré-établie, c'est à dire en concervant les espaces et les sauts de lignes, il faut utiliser la balise du type conteneur <pre> (preformated).
    <pre> permet en effet de réaliser une mise en page acceptable. Avant HTML 4, on ne pouvait aligner convenablement des données dans un tableau qu'en l'utilisant. De plus, cette balise applique une police à pas fixe, c'est à dire que la largeur du l et la même que celle du X.
    Note : attribut de <pre> : width. Permet de spécifier la largeur (en colonnes) de la page.
    Valeurs de width: 40, 80 (par défaut), 132. Toutefois il existe des différences lors de la visualisation entre entre Netscape et I.Explorer.
RETOUR SOMMAIRE