HTML 2

Par MCA Waid
HTML
<HTML>
<HEAD> 

<TITLE> Titre de la page </TITLE>
</HEAD>
<BODY> 

...
...
</BODY>
</HTML>
Lien d’un fichier :
"fichier.ext" Sur le même répertoire le nom du fichier

directement
"images/ fichier.ext " Sur un répertoire fils
"../ fichier.ext" Sur un répertoire parent
"../dossier/ fichier.ext " Combinaison
Un son de fond :
<bgsound src="fichier son" loop="nb_repetitions" />
Loop à « -1 » infini
Head :
<META name="keywords" content="html; programmation web; php" lang="fr">
<meta name="description" content="site destiné aux étudiants…" lang="fr">
<meta http-equiv="Content-Type" Content="text/html; charset="windows-

1252">
1
Par MCA Waid
Body :
BGCOLOR Couleur La couleur de fond de la page

TEXT Couleur La couleur par défaut du texte
LINK Couleur La couleur par défaut des liens
VLINK Couleur La couleur par défaut des liens
visités
ALINK Couleur La couleur par défaut des liens
actifs
BACKGROUND Lien d’une image Image de fond sur la page
Par défaut l’image de fond défile
avec le texte, pour la fixer on
rajoute l’attribut
bgproperties="fixed".
DIR Rtl ou ltr Pour modifier la direction de
l’écriture
Topmargin Numéro en px La marge du haut
Leftmargin Numéro en px La marge gauche
Mise en forme :
<font face=“nom_police_car” color=“couleur” size=“nb”> le texte </font>
Remarque : Size de 1 a 7
Gras <B>text</B> ou <Strong>text</Strong>

Italique <I>text</I> ou <Em>text</Em>
Souligné <U>text</U>
Exposant <SUP>text</SUP>
Indice <SUB>text</SUB>
Autres :
Niveau de titres <h1></h1> ou <h1></h1> ou … ou

<h6></h6>
Code <code> …</code>
Clavier <kbd> …</kbd>
Variable <var> …</var>
Citation <cite> …</cite>
Définition <dfn> …</dfn>
Exemple <samp> …</samp>
Bloc en retrait <blockquote> …</blockquote>
Adresse <address> …</address>
Imprimé (machine à écrire) <tt> …</tt>
Texte préformaté <pre> …</pre>
Agrandir <big> …</big>
Réduire <small> …</small>
2
Par MCA Waid
Paragraphe :
<p> paragraphe </p>
Pour l’alignement : Align = "center", "left"ou "right".
Séparateur :
Retour a la ligne <br>

Afficher une ligne horizontale <hr>
align : left , center right

Width : numéro ou %
Size : numéro
color : couleur
Noshade : effet 3D (pas de valeur)
Liste :
Type1
<ol>
<li> élément 1 </li>
</ol>
Par defaut la numerotation est : 1,2,3,…

Pour changer le type on utilise : type =
"I" ou "i" : grands ou petits chiffres romains,
"A" ou "a": alphabets majuscules ou minuscules,
"1" : numérotation ordinaire.
Remarque :
Pour changer le numéro du premier élément => l’attribut start dans <OL>, si le type est "A"
start=1 sa veut dire qu’on commence par le B
Type2
<ul>
</ul>
On peut importer une image pour jouer le rôle de la puce l’attribut imagesrc dans <UL>
3
Par MCA Waid
Type3 (liste de définition)
<dl> titre 1 </dl>

<dt> définition 1 </dt>
<dl> titre 1 </dl>
<dt> définition 2 </dt>
Liens :
<a href=‟fichier cible‟> texte </a>
1- interne :
On définit une étiquette à un endroit (une ancre) : <A NAME="nom_étiquette">...</A>
On définit le lien (la référence) : <A HREF="#nom_étiquette">...</A>
2- externe :
<A HREF="fichier">...</A>
href="mailto:adr_email" : ouvre l’application mail pour l’envoi d’un email
href="http://www.site.com " : lien vers un autre site
Images :
<img src=‟fichier‟ alt= „image‟ />
Src Fichier en format : .gif .jpg Définir le lien de l’image

.jpeg .png
Width / height Numéro hauteur, largeur
Alt Texte texte alternatif
Border Numéro Bordure autour de l’image
Align left, right, center, top, bottom Alignement de l’image
ou middle
Hspace Numéro en px Espacement par rapport au
texte autour de l’image (à
droite et à gauche)
Vspace Numéro en px en haut et en bas
Tableau :
<table>
<tr>
<td> element(1,1) </td>
4
Par MCA Waid

</tr>
<tr>
</tr>
</table>
<TH> … </TH> Titre de colonne. On peut s’en passer

<CAPTION> … </CAPTION> Titre du tableau, a insérer juste après
<TABLE>
<DIV> et </DIV> Alignement du tableau : on encadre le
tableau par ces balises
width et height hauteur, largeur
border en pixels pour l’épaisseur de la bordure
bordercolor définir la couleur de l’épaisseur
bordercolorlight et bordercolordark Pour avoir un effet 3D à la bordure claire et
la bordure sombre, leur valeurs son des
couleurs
bgcolor pour définir la couleur de fond
background pour fixer une image de fond
cellspacing définir l’espacement entre 2 cellules, en px
Cellpadding fixer la marge interne des cellules, en px
Les cellules <TD> :
Align left, right ou center

VAlign top, bottom ou middle
Width et Height hauteur, largeur
bgcolor Couleur du fond
background Image du fond
bordercolor, bordercolorlightet Couleur de la bordure
bordercolordark
nowrap Éviter le renvoi automatique à la ligne, sans
valeur
Fussioner cellules :
colspan Fusionnement horizontal : sa valeur est un

entier n ≥2 qui correspond au nombre de
cellules fusionnées
rowspan Fusionnement vertical: sa valeur est un entier
n ≥2 correspondant au nombre de cellules
fusionnées
5
Par MCA Waid
Les formulaires :
<form>
Les elements
</form>
Name Le nom du formulaire

Action Fichier cible
Methode GET / POST
Target Si on ouvre le cible dans une nouvel fenetre
ou non
Les elements :
Remarque : l’attribut name est très important dans les éléments
1- les element <input/> :
<form>
<input type=‟le type‟ name=‟nom‟ />
</form>
Dans l’attribut type :

TEXT Zone (Champ) de texte simple.
PASSWORD Zone de saisie de mot de passe
HIDDEN Champ masqué.
RADIO Case d’option (bouton radio).
CHECKBOX Case à cocher.
FILE Pour sélectionner un fichier à envoyer.
BUTTON Bouton de commande (simple).
SUBMIT Bouton d’envoi.
RESET Bouton de réinitialisation.
Les champs <INPUT> de type Text ou Password peuvent avoir d’autres attributs facultatifs :
Value Texte par défaut qui s’affichera.
Size Largeur du champ en nombre de caractères.
Maxlength Le nombre max de caractères.
Le champ <INPUT> de type Hidden nécessite obligatoirement l’attribut Value.
Checkbox et radio Ont les mêmes attributs :

Value La valeur.
Checked pour sélectionner ou cocher par défaut.
Size La taille de la zone textuelle en nombre de
caractères.
Accept Définit un filtre. Les types de fichiers
autorisés
6
Par MCA Waid
Zone de text :
<form>
<textarea> texte par défaut </textarea>
</form>
Name Le nom de l’element

Rows Le nombre de lignes qu’occupera la zone de
saisie.
Cols Le nombre de caractères qu’occupera la zone
en largeur
Liste déroulante :
<form>
<select>
<option> choix 1 </option>
<option> choix 2 </option>
</select>
</form>
Pour select
Name Le nom de l’element
Size Le nombre de lignes qu’occupera la zone
Multiple Attribut sans valeur, pour autoriser le choix
multiple
Pour option
Value associer une valeur au choix sélectionné.
C’est cette valeur qui sera envoyée au
serveur.
Selected (sans valeur) permet de sélectionner
l’élément par défaut
Autres :
TabIndex peut être rajouté à toute balise d’un élément
du formulaire. Sa valeur est un entier. Définit
l’ordre de sélection de cet élément en
utilisant la touche du TABULATION du
clavier
<fieldset >et </ fieldset > permet à l’intérieur du même formulaire de
créer des blocs.
<Legend>et </ Legend> Pour le titre du bloc, a mettre après
<fieldset>
7
Par MCA Waid
XHTML
Pour les éléments non-vides, les balises de fin sont obligatoires <br/>
Les noms d'élément et d'attribut doivent être en minuscule.
L’attribut spécifiant la langue <div lang=“en”xml:lang=“en”> Hello </div>
<!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"

HTML 2

Transféré par

Informations du document

Titre original

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

HTML 2

Transféré par

Droits d'auteur :

Formats disponibles

Par MCA Waid

<HEAD>

<BODY>

Lien d’un fichier :

"fichier.ext" Sur le même répertoire le nom du fichier

<bgsound src="fichier son" loop="nb_repetitions" />

<META name="keywords" content="html; programmation web; php" lang="fr">

<meta name="description" content="site destiné aux étudiants…" lang="fr">

<meta http-equiv="Content-Type" Content="text/html; charset="windows-

BGCOLOR Couleur La couleur de fond de la page

<font face=“nom_police_car” color=“couleur” size=“nb”> le texte </font>

Gras <B>text</B> ou <Strong>text</Strong>

Niveau de titres <h1></h1> ou <h1></h1> ou … ou

<p> paragraphe </p>

Pour l’alignement : Align = "center", "left"ou "right".

Retour a la ligne <br>

align : left , center right

Par defaut la numerotation est : 1,2,3,…

Type3 (liste de définition)

<dl> titre 1 </dl>

<a href=‟fichier cible‟> texte </a>

<img src=‟fichier‟ alt= „image‟ />

Src Fichier en format : .gif .jpg Définir le lien de l’image

<td> element(1,2) </td>

<TH> … </TH> Titre de colonne. On peut s’en passer

Les cellules <TD> :

Align left, right ou center

colspan Fusionnement horizontal : sa valeur est un

Name Le nom du formulaire

1- les element <input/> :

Dans l’attribut type :

Le champ <INPUT> de type Hidden nécessite obligatoirement l’attribut Value.

Checkbox et radio Ont les mêmes attributs :

Name Le nom de l’element

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

Vous aimerez peut-être aussi