Mini mémento HTML. Rappel: Les codes HTML sont insensibles à la

Transcription

Mini mémento HTML. Rappel: Les codes HTML sont insensibles à la
Baseshtml.doc –page 1/2 – BA 2005-2006
Mini mémento HTML.
Rappel: Les codes HTML sont insensibles à la casse.
Structure du document.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Saisir le titre de la page entre ces 2 balises</title>
</head>
<body bgcolor="#FFFFCC" text="#3300CC" link="#FF66CC" vlink="#666666">
<!---Déclaration des propriétés de la page--->
Texte visible par le visiteur.
</body>
</html>
Insérer un commentaire:
<!---------commentaire---->
Caractéristiques du texte:
<b>Gras</b>
<i>italique</i>
<u>souligné</u>
Insérer une police avec taille et couleur particulière:
<font face="verdana" color="#ff0000" size="3">texte rouge en verdana taille 3 </font>
Taille des caractères avec la police par défaut: (De 1 à 6)
<h3>Taille</h3>
Alignement des paragraphes
Gauche (Par défaut)
<center>Centré</center>
<div align="right">Droite</div>
<div align="justify">justifié </div>
Caratères particuliers (exemples):
é:&eacute; è:&egrave; ç&ccedil; à:&agrave; &:&amp;
<: &lt;
>: &gt;
espace:&nbsp;
<br> Retour à la ligne
<p> Nouveau paragraphe
<hr> Ligne horizontale
Insérer une image (ave ses caractéristiques):
<img src="ocean.jpg" width="200" height="150" border="0" alt="Image ocean"
align="middle">
Insérer un lien:
Lien externe:
<a href="http://www.altavista.fr" >Altavista</a>
Lien vers un fichier du même site
<a href="page2.html">Page 2</a>
Lien vers une ancre sur la même page
Créer une ancre:
<a name="haut"></a>
Lien
<a href="#haut">haut de la page</a>
Lien Email:
<a href="mailto:[email protected]">Ecrivez-moi</a>
Baseshtml.doc –page 2/2 – BA 2005-2006
Listes:
Nom numérotées
<ul>
<li>Premier cas</li>
<li>Second cas</li>
</ul>
Numérotées
<ol>
<li>Premier cas</li>
<li>Cas suivant</li>
</ol>
Descriptives (Menu):
<dl>
<dt>Internet<dd>Réseau de réseaux
<dt>HTML<dd>Langage des pages Web
</dl>
Texte préformaté:
<pre>Ceci est un texte : ééààà sont des lettres avec accents saisie directement sans
codes html</pre>
Tables (Exemple :Deux lignes et deux colonnes, puis une ligne et regroupement des deux colonnes):
<table border="1" width="50%"> <!--Déclaration de la table--->
<tr> <!---Début de ligne--->
<td>un</td><!---Délaration de début et de fin de colonne--->
<td>deux</td>
</tr>
<tr>
<td>trois</td>
<td>quatre</td>
</tr>
<tr>
<td colspan=2>Cinq</td> <!---Regroupement de colonnes--->
</tr> <!---Fin de ligne--->
</table><!---Fin de la table--->
Formulaires:
Attention à la balise action qui renvoie vers un programme qui récupère les données
et les éxécute:
Formulaire E-mail:
<form action="mailto:[email protected]">
<input name="nom" type="text" value="Saisir votre nom ici<textarea name="" rows=5
cols=20 ></textarea>
<input type="submit"><input type="reset >
</form>
Formulaire relatif à un programme (Requête vers l' annuaire lesweb.com:
<form action="http://www.leswebs.com/cgi-bin/moteur.cgi?recherche" method="POST">
Tapez les mots clés: <input type="text" size="20" name="mc">
<input type="submit" value="Rechercher">
</form>
Grand nombre de documents de qualité sur le WEB sur ce sujet : par exemple en faisant une
recherche de documents .pdf sur google avec comme mot clé : HTML. Résultat impressionnant.

Documents pareils