HTML
Exemple
   Accueil      HTML-XHTML
 

HTML-XHTML
 
 
 

Code

Affichage


 
 

Chapitre 1
 
 
 
<html>
<head>
<title>Voici le titre</title>
</head>
<body>
Ici on met le texte de la page
</body>
</html>

Voici le titre

 
Ici on met le texte de la page
 
 
Chapitre 2
 
 
 
Page XHTML (typique)
<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Voici le titre</title>
<meta http-equiv="Content-Type"
content="text/html; charset=utf-8" />
</head>
<body>
Ici on met le texte de la page
</body>
</html>

Voici le titre

 
Ici on met le texte de la page
Page HTML (typique)
<!DOCTYPE HTML PUBLIC
"-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Voici le titre</title>
<meta http-equiv="Content-Type"
content="text/html; charset=utf-8">
</head>
<body>
Ici on met le texte de la page
</body>
</html>

Voici le titre

 
Ici on met le texte de la page
<p>Voici du contenu sur une ligne</p>
 
ou
 
<p>Voici du
contenu
sur une
ligne
</p>
Voici du contenu sur une ligne
 
ou
 

Voici du contenu sur une ligne

<h1>Titre de niveau 1</h1>
<h2>Titre de niveau 2</h2>
<h3>Titre de niveau 3</h3>
<h4>Titre de niveau 4</h4>
<h5>Titre de niveau 5</h5>
<h6>Titre de niveau 6</h6>

Titre de niveau 1

Titre de niveau 2

Titre de niveau 3

Titre de niveau 4

Titre de niveau 5
Titre de niveau 6
Caratères:
&lt;
&gt;
&amp;
&#194
©
 
< 
> 
&
Â
©
<cite>citation</cite>
<em>italique</em>
ou
<i>italique</i>
<strong>gras</strong>
ou
<b>gras</b>
<u>souligner</u> « deprecated »
 
Combinaisons:
<strong><em>texte</em></strong>
<del>barré</del>
<blockquote>paragraphe en retrait</blockquote>
<br />change de ligne à l’intérieur d’un paragraphe.
 

<var>texte</var>
<kbd>texte</kbd>
<code>texte</code>
<sample>texte</sample>
<dfn>texte</dfn>
&nbsp; (espace insécable)
citation
italique
 
italique
gras
 
gras
souligner

 
texte
barré
paragraphe en retrait

change de ligne à l’intérieur d’un paragraphe
texte
texte
texte
texte
texte
 

<h1>Titre de section de niveau 1</h1>
<h2>Titre de section de niveau 2</h2>
…
<h6>Titre de section de niveau 6</h6>
<em>italique</em> <i>italique</i>
<b>gras</b> <strong>gras</strong>
<p>
Paragraphe. Un espace est automatiquement
créé avant et après le paragraphe.
</p>
<blockquote>
Paragraphe avec marge de gauche en retrait.
Saut de ligne.<br />
Permet de changer de ligne sans débuter un nouveau
paragraphe.
Le marqueur <br /> n’a pas de fermeture.
</blockquote>

Titre de section de niveau 1

Titre de section de niveau 2

…
Titre de section de niveau 6
italique italiquegras gras

Paragraphe. Un espace est automatiquement créé avant et après le paragraphe.

Paragraphe avec marge de gauche en retrait. Saut de ligne.
Permet de changer de ligne sans débuter un nouveau paragraphe. Le marqueur
n’a pas de fermeture.
<hr> : ligne horizontale<hr>
ou
<hr> : ligne horizontale<hr />

• width=n, n% (largeur en pixels ou en %)
• size=n (épaisseur de la ligne en pixels)
• noshade (ligne pleine)
• align= left, right, center (alignement de la ligne)
• Exemple: <hr width="50%" align="center" />
 
 
 
 
 
 
 
 

<div>section</div>
section
<!-- commentaires -->
 
<pre>texte</pre> à éviter
 
 texte
<big>texte</big>
texte
<small>texte</small>
texte
<address>équ. à <font>texte</font>signature</address>
équ. à signature
 
 
<font>texte</font>
 
 
 
<font size=7>texte</font size=7>
 
 
<font size=6>texte</font size=6>
 
 
<font size=5>texte</font size=5>
 
 
<font size=4>texte</font size=4>
 
<font size=3>texte</font size=3>
 
<font size=2>texte</font size=2>
 
 
<font size=1>texte</font size=1>
 
<font size=0>texte</font size=0>
 
<font size=-1>texte</font size=-1>
 
<font size=-2>texte</font size=-2>
 
<font size=-3>texte</font size=-3>
 
<face>“nom”</face>

<font color="#ff0000">couleur</font>
texte
texte
texte
texte
texte
 
texte
 
texte
 
texte
 
texte
 
texte
 
texte
 
texte

“nom”

couleur
Listes à puces
(listes non numérotées)
<ul>
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
</ul>
  • item 1
  • item 2
  • item 3
Listes à puces
(modèles)
<ul>
<li type=square>item 1</li type=square>
<li type=circle>item 2</li type=circle>
<li type=disc>item 3</li type=disc>
</ul>
  • item 1
  • item 2
  • item 3
Listes numérotées
<ol>
<li type=1 value=1 start=1>item 1</litype=1 value=1,start=1>
<li type=i value=1 start=1>item 2</li type=i value=1 start=1>
<li type=I value=1 start=1>item 3</li type=I value=1 start=1>
<li type=a value=1 start=1>item 4</li type=a value=1 start=1>
<li type=A value=1 start=1>item 5</li type=A value=1 start=1>
</ol>
 
  1. item 1
  2. item 2
  3. item 3
  4. item 4
  5. item 5
 
Listes de glossaire
<dl>
<dt>terme</dt>
<dd>définition</dd>
<dt>…</dt>
<dd>…</dd>
</dl>
terme
définition
…
…

<ol type="1">
<li>WEB
<ol type="a">
<li>HTML</li>
<li>CSS</li>
</ol></li>
<li>Graphiques
<ol type="a">
<li>Images</li>
<li>Dessins</li>
</ol></li>
</ol>
  1. WEB
    1. HTML
    2. CSS
  2. Graphiques
    1. Images
    2. Dessins
<img alt="" title="" align=middle border=1 vspace=5 src="/3rdparty/rvsitebuilder/project/fdc52472e7680696c47d5d18412ec1ad/images/html.jpg" height="48" width="64" />
 
attributs:
• alt=“texte” (obligatoire)
• align=left, right, top, middle, bottom, … (autres moins standards)
• border=n
• height=n
• width=n
• hspace=n
• vspace=n
<br clear=“left”>, right, all
 
<td bgcolor="blue">
 
16 couleurs standards
(aqua, black, blue, fuchsia, gray, green, lime, maroon, navy,
olive, purple, red, silver, teal, white, et yellow).
 
<td bgcolor="#0000ff">
 
<td bgcolor="#000000">
 
<td bgcolor="#ffffff">
 
<td bgcolor="#800000">