Memento XHTML

Mmento XHTML - Balises courantes
La structure XHTML
Entte
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xml:lang="fr" lang="fr">
<head>
<title>TITRE DU DOCUMENT</title>
<meta http-equiv="content-type"
content="text/html;charset=utf-8" />
</head>
<body>

<p>VOTRE TEXTE</p>
</body>
</html>
<head>

<title>Titre du document</title>
content="text/html;charset=utf-8" />
<meta name="author" content="Albert Dupont" />
<meta name="description" content="Description du
contenu de la page Web en 150 caractres maximum." />
<meta name="date"
content="2008-12-31T05:00:00+01:00">

<link rel="shortcut icon" type="image/x-icon"
href="favicon.ico" />

<link type="text/css" rel="stylesheet" media="all"
href="style.css" />
<style type="text/css">
<!-/* Placez ici les directives CSS */
-->
</style>

<script src="script.js" language="javascript"
type="text/javascript"></script>
<script type="text/javascript">
<!-// Placez ici le code Javascript
//-->
</script>
</head>
Autres doctypes
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
Texte courant
Titres
h1, h2, ..., h6
<h1>Titre de la page</h1>
<h2>Titre de 2e niveau</h2>
...
Voir aussi la balise

<title> en section
Entte
Paragraphe
<p>Un simple paragraphe.</p>

Emphase simple et forte
Entits obligatoires
em, strong
<p><strong>Attention</strong>, le texte est protg par un

<em lang="en">copyright</em>.</p>
Retour de ligne
br
<p>Les programmes de Windows se trouvent dans : <br />

<code>C:\Program files</code></p>
Abrviation
abbr
<p>La <abbr title="Socit nationale des chemins de

fer">SNCF</abbr> existe depuis 1938</p>
Indice et exposant
sub, sup
<p>Le 2<sup>e</sup> lment de l'H<sub>2</sub>O est

l'oxygne.</p>
Dfinition d'un terme
dfn
bdo
<p dir="ltr">Il a dit : <q><bdo dir="rtl">< /bdo>

(<em>Was-salaam alaykum</em>)</q>.</p>
Commentaires

< <
> >
" "
& &
«
»
Entits courantes
Espace inscable
€
©
®
Hyperliens
Lien


<a href="http://www.example.com"
title="Explication du lien">Texte cliquable</a>

<a href="mailto:adupont@example.com">Envoyez-nous un
email</a>
Ancre nomme
<p>L'<dfn>eau</dfn> est un compos chimique, trs

courant sur le Terre, [...]</p>
Orientation du texte
Autre encodage courant :

content="text/html;charset=iso-8859-1" />
<a id="identifiant_unique"
name="identifiant_unique">Texte</a>
Images
Image
img
<img src="images/photo.jpg" alt="Texte pour les aveugles"

width="480" height="320" />
1/2
Citations et rfrences
Citations longues
Listes
blockquote
<blockquote cite="http://abu.cnam.fr/">
<p>Une embuscade tait probable.</p>
<p>Trente grenadiers, dtachs en claireurs et
commands par un sergent, marchaient [...]</p>
<cite>Victor HUGO, Quatre-vingt Treize.</cite>
</blockquote>
q
<p>Il dit : <q>Fermez la porte !</q></p>

Rfrence un document
cite
<p>C'est V. Hugo qui a crit <cite>Ruy Blas</cite>.</p>

address
Texte technique
Texte prformat
pre
<pre>$a = "fr_FR";
setlocale(LC_ALL, $a);
date_default_timezone_set('Europe/Paris');
</pre>
<ul>
<li>1er lment de la liste</li>
<li>2e lment de la liste</li>
</ul>
<dl>
<dt>Terme 1</dt>
<dd>Dfinition du terme 1</dd>
<dt>Terme 2</dt>
<dt>Terme 3</dt>
</dl>
Tableaux simples
code, var
keyb, samp
<p>Si vous tapez la commande <keyb>del mydir</keyb>, le

programme rpondra <samp>C:\mydir\*, tes-vous sr
(O/N) ?</samp>. Rpondez : <keyb>N</keyb>.</p>
Balises gnriques
Elment Bloc gnrique
div
<div class="avertissement">
<p><strong>Attention</strong></p>
<p>Le formatage peut causer la perte de donnes.</p>
</div>
Elment en-ligne gnrique
span
<p>La fonction <span class="fonction">trim</span> retire

les espaces des extrmits de chaine.</p>
Attributs gnriques
<p class="classe_css" id="id_unique" title="etiquette"
style="color:#FF0000" >Texte de la balise</p>
<iframe src="page.html" width="480" height="240"

name="inclusion1">
<p>Votre navigateur ne peut malheureusement pas
afficher de cadre incorpor. Vous pouvez appeler
la page incorpore par ce lien:
<a href="page.html">Titre de la page</a></p>
</iframe>
table, tr, th, td, caption
<table width="240" border="1">

<caption>Lgende du tableau</caption>
<tr>
<th width="40%">Titre col. 1</th>
</tr>
<tr>
<td>Donnes l1 : col1</td>
</tr>
<tr>
</tr>
</table>
Fusion des cellules dans un tableau:
<td colspan="2"> Cellule fusionne sur 2 colonnes</td>

<td rowspan="2"> Cellule fusionne sur 2 lignes</td>
Balises obsoltes
... ou en passe de le devenir
tt, i, b, big, small, hr, frame, frameset
Balises non dcrites dans ce document
Cadre incorpor
2/2
dl, dt, dd
Tableaux
<p>La commande <code>$a="fr_FR"</code> permet

d'affecter une valeur la variable <var>$a</var>.</p>
Commandes
OL CSS - list-style-type : none|decimal|lower-roman|upperroman|lower-alpha|upper-alpha

Listes non-ordonnes (puces)
ul, li
UL CSS - list-style-type : none|disc|circle|square

Listes de termes
<address>
Albert Dupont,<br />
<em>Journaliste, spcialiste Web 2.0</em>,<br />
<a href="mailto:adupont@monjournal.com">
adupont@monjournal.com</a>
</address>
Code source et variable
ol, li
<ol>
<li>1er lment de la liste</li>
</ol>
Citation courtes
Auteur de la page Web
Listes ordonnes
map et area (zones cliquables)

object, embed et param (incorporation de mdias)
form, input, select, textarea, etc. (formulaires)
del et ins (versionning)
Auteur : Eric Bellot. Mis jour le 2010-01-24

Document publi selon les termes de la licence Creative Commons
CC-BY-SA : http://creativecommons.org/licenses/by-sa/2.0/fr/

Memento XHTML

Hochgeladen von

Dokumentinformationen

Originaltitel

Copyright

Verfügbare Formate

Dieses Dokument teilen

Dokument teilen oder einbetten

Freigabeoptionen

Stufen Sie dieses Dokument als nützlich ein?

Sind diese Inhalte unangemessen?

Copyright:

Verfügbare Formate

Memento XHTML

Hochgeladen von

Copyright:

Verfügbare Formate

Mmento XHTML - Balises courantes

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"

h1, h2, ..., h6

Voir aussi la balise

<p>Un simple paragraphe.</p>

<p><strong>Attention</strong>, le texte est protg par un

<p>Les programmes de Windows se trouvent dans : <br />

<p>La <abbr title="Socit nationale des chemins de

<p>Le 2<sup>e</sup> lment de l'H<sub>2</sub>O est

<p dir="ltr">Il a dit : <q><bdo dir="rtl">< /bdo>

Mmento XHTML - Balises courantes

<p>L'<dfn>eau</dfn> est un compos chimique, trs

Autre encodage courant :

<img src="images/photo.jpg" alt="Texte pour les aveugles"

<p>Il dit : <q>Fermez la porte !</q></p>

<p>C'est V. Hugo qui a crit <cite>Ruy Blas</cite>.</p>

<p>Si vous tapez la commande <keyb>del mydir</keyb>, le

<p>La fonction <span class="fonction">trim</span> retire

<iframe src="page.html" width="480" height="240"

table, tr, th, td, caption

<table width="240" border="1">

<td colspan="2"> Cellule fusionne sur 2 colonnes</td>

Balises non dcrites dans ce document

<p>La commande <code>$a="fr_FR"</code> permet

OL CSS - list-style-type : none|decimal|lower-roman|upperroman|lower-alpha|upper-alpha

UL CSS - list-style-type : none|disc|circle|square

Code source et variable

Auteur de la page Web

map et area (zones cliquables)

Auteur : Eric Bellot. Mis jour le 2010-01-24

Mmento XHTML - Balises courantes

Das könnte Ihnen auch gefallen