Paragraphes
Séparateurs
Listes


Contenus de cette page
Eléments
Apparence
Codage
Paragraphes Blocs de texte terminés par une ligne vide et dont on peur contrôler l'alignement : gauche, centré, droite. <P> ... </P>
Séparateurs
<HR>
Listes de définitions
( Definition List )

pélagique
poisson ou organisme séjournant normalement
en haute mer
pélécaniforme
oiseau à quatre doigts reliés par une palmure, tel le pélican, le cormoran, le fou, la frégate.

 

<DL>
<DD>pélagique</DD>
<DT>poisson.....</DT>

<DD>pélécaniforme</DD>
<DT>oiseau......</DT>

</DL>
Listes à puces
( Unordered Lists )
  • boire
  • manger
  • dormir

<UL>
<LI>boire</LI>
<LI>manger</LI>
<LI>dormir</LI>
</UL>
Types de puces
  • disc - type par défaut
  • circle
  • square

<UL
TYPE= DISC,
TYPE = CIRCLE,
TYPE= SQUARE
>
Listes numérotées
( Ordered Lists )
  1. boire
  2. manger
  3. dormir
 <OL>
<LI>boire</LI>
<LI>manger</LI>
<LI>dormir</LI>
</OL>
Types de numérotation
  1. Type A
  2. Type A
  1. Type a
  2. Type a
  1. Type I
  2. Type I
  3. Type I
  4. Type I
  1. Type i
  2. Type i
  3. Type i
  4. Type i
  1. Type 1 - type par défaut
  2. Type 1

<OL TYPE=A,a,I,i,1>

Paragraphes :

Un paragraphe est un ensemble de lignes que l'on distingue du reste du texte par deux lignes vides, une avant une après,
et parfois par un alignement (gauche, centré, droite) différent des paragraphes environnants.

La balise " P " insère automatiquement un espace d'une ligne après la dernière ligne du texte et autorise les trois alignements.

Paramètres de la balise <P> ... </P>
<P ALIGN=LEFT ( ou =CENTER, ou =RIGHT ) > Texte du paragraphe ... </P>
LEFT Alignement du paragraphe à gauche.
CENTER Chaque ligne du paragraphe est centrée sur l'écran
RIGHT Alignement du paragraphe à doite.

Un exemple de paragraphes est donné ci-dessous dans le fichier source "paragraphes_séparateurs.html"

Séparateurs :

Un séparateur est un trait horizontal introduit par la balise " HR " et dont on peut contrôler à la fois la longueur, l'épaisseur et l'alignement
On a déjà eu l'occasion d'en voir dans ces pages de cours.

Voici trois séparateurs de tailles différentes, ils sont tous centrés, le plus long est sans ombre portée.:


Paramètres de la balise <HR>
<HR ALIGN= SIZE= WIDTH= NOSHADE> crée une ligne horizontale dimensionnable
ALIGN= LEFT, CENTER, RIGHT : Alignement gauche, centré, droit
SIZE= Largeur de trait en pixels
WIDTH= Longueur de trait.
WIDTH= x : en pixels
WIDTH= % x : en pourcentage de largeur de la fenêtre.
NOSHADE Pas d'ombre portée

Exemples

Cliquez ici pour visualiser paragraphes_separateurs.html


Listes

Cliquez ici pour visualiser une page web simple mettant en oeuvre les diverses balises de listes.

Nous vous rappelons que vous pouvez toujours visualiser le code source qui génère un écran web en cliquant [Affichage] dans la barre des menus de l'explorateur puis en activant [Source] dans le menu déroulant.

 


Au risque de nous répéter ...
Souvenez vous que l'on ne retient rien en lisant passivement les exemples qui vous sont proposés.

Créez vous-même des variantes de ces exemples.
Testez avec votre explorateur les fichiers source que vous créez.
Exercez-vous à inventer des présentations avec différents attributs de caractères,
des couleurs, des paginations différentes.
Essayez tous les paramètres des balises nouvellement apprises pour voir leur effet.

Vous pouvez toujours utiliser le copier-coller des exemples vers vos fichiers html d'entraînement, ceci pour vous simplifier le travail en g agnant du temps. Vous modifierez par la suite ce code à votre guise.

Nous vous avons donné une méthode travail en première page, suivez-la.

Exercice suivant.
Sommaire des cours HTML
Page d'accueil