HTML

YuGiOhJCJ

1 Avant propos...
2 Introduction
3 Les titres
4 Les paragraphes
5 Les lignes
6 Les listes
    6.1 Les listes à puces
    6.2 Les listes ordonnées
7 Les images
8 Les liens
    8.1 Les ancres
9 Les tableaux
    9.1 La fusion de cellules
10 Les commentaires

1 Avant propos...

Cette documentation a été rédigée par YuGiOhJCJ. Vous lisez actuellement la version 20090823 qui est gratuite. Si vous souhaitez utiliser une partie de cette documentation pour vos créations, veuillez d'abord me contacter à yugiohjcj@1s.fr. La version la plus récente de ce document est disponible à l'adresse http://yugiohjcj.1s.fr/. Cette publication peut contenir certaines erreurs. N'hésitez pas à me les rapporter pour que j'effectue une correction.

2 Introduction

Le langage HTML est un langage de marquage pour créer des pages web. Il est normalisé par le W3C¹. C'est une suite de balises ouvrantes et fermantes. Voici un exemple :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>
			Le titre de ma page
		</title>
	</head>
	<body>
	</body>
</html>

Des arguments peuvent être placés dans les balises. Par exemple, pour avoir un arrière-plan rouge :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>
			Le titre de ma page
		</title>
	</head>
	<body bgcolor="#FF0000">
	</body>
</html>

Je vais présenter les principales balises.

3 Les titres

<h1>Voici un titre de niveau 1.</h1>
<h2>Voici un titre de niveau 2.</h2>
<h3>Voici un titre de niveau 3.</h3>

4 Les paragraphes

<p>Voici un paragraphe.</p>

5 Les lignes

<hr>

6 Les listes

6.1 Les listes à puces

<ul>
	<li>Voici le premier élément de la liste</li>
	<li>Voici le second élément de la liste</li>
	<li>Voici le troisième élément de la liste</li>
</ul>

6.2 Les listes ordonnées

<ol>
	<li>Voici le premier élément de la liste</li>
	<li>Voici le second élément de la liste</li>
	<li>Voici le troisième élément de la liste</li>
</ol>

7 Les images

Une image au format GIF, JPEG ou PNG peut être affichée sur la page à l'aide de la balise «img».

<img alt="Mon image" src="mon_image.png" title="Mon image" >

8 Les liens

Un lien est une zone interactive de la page qui permet de naviguer vers une nouvelle adresse. Un lien peut être ajouté sur la page à l'aide de la balise «a».

<a href="http://yugiohjcj.1s.fr/">Cliquez ici</a>

8.1 Les ancres

Une ancre est un lien spécial qui se limite à la navigation dans la page courante.

<a href="#bas">Cliquez ici pour aller en bas de la page</a>
[...]
<a name="bas"></a>

9 Les tableaux

Les tableaux sont composés de lignes et de colonnes. Chaque intersection entre ligne et colonne forme une zone appelée cellule.

<table>
	<tr>
		<th>
			Cellule colonne 1, ligne 1
		</th>
		<th>
			Cellule colonne 2, ligne 1
		</th>
	</tr>
	<tr>
		<td>
			Cellule colonne 1, ligne 2
		</td>
		<td>
			Cellule colonne 2, ligne 2
		</td>
	</tr>
</table>

9.1 La fusion de cellules

Avec l'argument «colspan», il est possible de fusionner les colonnes du tableau pour faire tenir une seule cellule sur plusieurs colonnes.

<table>
	<tr>
		<th colspan="2">
			Cellule colonne 1 et 2, ligne 1
		</th>
	</tr>
	<tr>
		<td>
			Cellule colonne 1, ligne 2
		</td>
		<td>
			Cellule colonne 2, ligne 2
		</td>
	</tr>
</table>

A l'inverse, avec l'argument «rowspan» il est possible de fusionner les lignes du tableau pour faire tenir une seule cellule sur plusieurs lignes.

<table>
	<tr>
		<td rowspan="2">
			Cellule colonne 1, ligne 1 et 2
		</td>
		<td>
			Cellule colonne 2, ligne 1
		</td>
	</tr>
	<tr>
		<td>
			Cellule colonne 2, ligne 2
		</td>
	</tr>
</table>

10 Les commentaires

Les commentaires apparaissent uniquement dans le code source de la page. Ils sont invisibles sur la page affichée par le navigateur web.

<!--
Voici un commentaire HTML
-->

Footnotes:

¹W3C: World Wide Web Consortium, http://www.w3.org/

File translated from T_EX by T_TH, version 3.85.
On 23 Aug 2009, 10:28.