SELFHTML

Éléments généraux pour des passages de texte

Page d'information: vue d'ensemble

vers le bas Élément de bloc commun
vers le bas Élément de bloc plus ancien pour des passages centrés
vers le bas Élément incorporé commun
vers le bas Formater les éléments communs avec les CSS
vers le bas Autres informations

 vers le bas 

HTML 3.2XHTML 1.0MSIE 3.0Netscape 3.0 Élément de bloc commun

Vous pouvez inclure dans un passage commun plusieurs éléments très différents comme du texte, des graphiques, des tableaux etc. Cet élément commun ne fait rien d'autre que de commencer dans une nouvelle ligne du flux de texte. Autrement il n'a aucune propriété. Il est conçu pour être vers le bas formaté à l'aide de feuilles de style .

Exemple:

Démonstration - nouvelle fenêtre Exemple d'affichage: aperçu

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Texte du titre</title>
</head>
<body>

<div align="center">
<h1>Tout centré</h1>
<ul>
<li>tout centré</li>
<li>tout?</li>
<li>tout!</li>
</ul>
</div>

<div align="right">
<h1>Tout contre la marge droite</h1>
<ul>
<li>tout contre la marge droite</li>
<li>tout?</li>
<li>tout!</li>
</ul>
</div>

</body>
</html>

Explication:

Avec <div> vous marquez le début d'un passage dans lequel vous pouvez inclure plusieurs éléments de bloc (div = division = passage). Tout ce qui se trouve entre ce repère et le repère de fermeture </div> est interprété comme partie intégrante du passage.

Vous pouvez aligner un tel passage et tous les éléments qu'il contient avec l'attribut align= dans le repère d'ouverture <div>. Avec align="center" vous centrez le passage avec tous ses éléments (align = alignement, center = centré), avec align="right" vous l'alignez à droite (right = à droite). Avec align="justify" Les éléments qui se trouvent dans ce passage comme du texte des paragraphes ou des titres seront justifiés . Avec align="left" vous vous assurez de l'alignement à gauche des éléments (réglage par défaut).

Attention:

L'élément div va continuer à faire partie du standard HTML. L'attribut align= par contre est classé comme en cours d'abandon et doit `à l'avenir n'y plus figurer. À la place, vous devez travailler avec les feuilles de style CSS.

 vers le hautvers le bas 

HTML 3.2XHTML 1.0MSIE 3.0Netscape 3.0 Élément de bloc plus ancien pour des passages centrés

Vous pouvez centrer ensemble plusieurs paragraphes comportant des éléments très différents comme du texte, des graphiques, des tableaux etc. Vous pouvez ensuite aligner ce passage avec tous ses éléments. Cet élément est cependant classé comme en cours d'abandon. Il est entre-temps devenu superflu et ne doit encore être employé qu'exceptionnellement pour des raisons fondées (par exemple compatibilité vers l'amont avec Netscape 1.1).

Exemple:

Démonstration - nouvelle fenêtre Exemple d'affichage: aperçu

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Texte du titre</title>
</head>
<body>

<center>
<h1>Texte artistique centré</h1>
<pre>
<big>.*A*:._.:*R*:._.:*T*:._.:._.::*A*:._.:*S*:._.:*C*:._.:*I*:._.:*I*:*~*:.</big>
</pre>
</center>

</body>
</html>

Explication:

Avec <center> vous introduisez un passage dans lequel tout ce qui suit est centré (center = centré). Cela peut être par exemple des titres, du texte, des graphiques ou des tableaux. Avec le repère de fermeture </center> la commande pour centrer prend fin.

 vers le hautvers le bas 

HTML 4.0XHTML 1.0MSIE 4.0Netscape 4.0 Élément incorporé commun

Il y a un élément qui, de façon analogue à l'élément div qui peut contenir d'autres éléments de bloc, peut contenir du texte et d'autres éléments incorporés sans avoir lui-même la moindre propriété ni le moindre effet. Il est conçu pour être vers le bas formaté avec les CSS.

Exemple:

Démonstration - nouvelle fenêtre Exemple d'affichage: aperçu

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Texte du titre</title>
</head>
<body>

<h1 style="font-size:500%">
<span style="color:blue">A</span>
<span style="color:red">B</span>
<span style="color:green">C</span>
</h1>

</body>
</html>

Explication:

<span> introduit un passage incorporé commun. </span> met fin à ce passage. L'exemple montre un titre N°1, lui-même déjà formaté avec les CSS pour avoir une taille de police de 500%. À l'intérieur du titre sont notées trois lettres ABC. Chacune d'entre elles est incluse dans un élément span, et pour chaque élément span est affectée à l'aide des CSS une autre couleur de police.

Attention:

Dans la variante "Strict" les éléments incorporés ne peuvent être notés qu'à l'intérieur d'éléments de bloc. Dans l'exemple ci-dessus, c'est le cas étant donné que les éléments span sont placés dans un élément titre.

 vers le hautvers le bas 

HTML 4.0XHTML 1.0MSIE 3.0Netscape 4.0 Formater les éléments communs avec les CSS

Les éléments communs pour passages de texte ne prennent vie que par le formatage. Avec les Chapitre: vue d'ensemble feuilles de style CSS vous pouvez cependant formater de tels éléments comme vous le désirez. Pour employer des feuilles de style CSS, il vous faut d'abord savoir comment Chapitre: vue d'ensemble définir des formats CSS. Ensuite, vous serez en mesure d'appliquer les propriétés CSS. En relation avec ce qui vient d'être décrit les données de feuilles de style suivantes sont aussi intéressantes:
Autre page d'information formatage de la police
Autre page d'information alignement et paragraphes
Autre page d'information espaces marges extérieures
Autre page d'information espace intérieur
Autre page d'information cadres
Autre page d'information couleurs et images d'arrière plan
Autre page d'information positionnement et affichage d'éléments

Exemple:

Démonstration - nouvelle fenêtre Exemple d'affichage: aperçu

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Strict//EN"
       "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Texte du titre</title>
</head>
<body>

<div style="text-align:center; padding:20px; border:thin solid red; margin:25px">
<h1>Tout centré</h1>
<ul>
<li>tout centré</li>
<li>tout?</li>
<li><span style="font-weight:bold; color:red">tout!</span></li>
</ul>
</div>

<div style="text-align:right; padding:20px; border:thin solid blue; margin:25px">
<h1>Tout contre la marge droite</h1>
<ul>
<li>tout contre la marge droite</li>
<li>tout?</li>
<li><span style="font-weight:bold; color:blue">tout!</span></li>
</ul>
</div>

</body>
</html>

Explication:

L'exemple provoque une sortie similaire à celle de l'exemple du paragraphe vers le haut Élément de bloc commun, pourtant formaté cette fois avec les feuilles de style CSS et de ce fait également conforme à la variante HTML "Strict". Les deux passages div reçoivent une fine bordure continue, la première rouge, la deuxième bleue. Un espace intérieur de 20 pixels fait en sorte que le texte ne colle pas à la bordure, et un marge de 25 pixels garantit qu'il y ait de la place à gauche, à droite, en haut et en bas de la bordure. Le dernier point de la liste est marqué dans chacune d'entre elles avec un élément incorporé vide span et reçoit un formatage en caractères gras et une couleur de police.

 vers le hautvers le bas 

Autres informations

Dans le Chapitre: vue d'ensemble sommaire de référence HTML vous trouverez des données précisant où les éléments conteneurs peuvent être mis, quels autres éléments ils peuvent contenir, quels attributs ils peuvent avoir et ce à quoi il faut veiller pour ces différents attributs:
Autre page d'information référence pour les éléments pour l'élément de bloc commun (<div>...</div>)
Autre page d'information référence pour les attributs pour l'élément de bloc commun (<div>...</div>)
Autre page d'information référence pour les éléments pour l'élément centré de bloc commun (<center>...</center>)
Autre page d'information référence pour les attributs pour l'élément centré de bloc commun (<center>...</center>)
Autre page d'information référence pour les éléments pour l'élément incorporé commun (<span>...</span>)
Autre page d'information référence pour les attributs pour l'élément incorporé commun (<span>...</span>)

 vers le haut
page suivante Autre page d'information Lignes de séparation
page précédente Autre page d'information Marquage physique de texte
 

© 2001 Stefan Münz / © 2003 Traduction Adresse électronique Serge François, 13405@free.fr
Adresse électronique selfhtml@fr.selfhtml.org