Vous êtes sur la page 1sur 2

Structure du document Tableaux Notation de Formulaires

<!-- ... --> Code en commentaire. <table param...> Balise de création de table. couleurs <form params...> Création d'un formulaire.

<H1>|<H2>|...<H6> Header : titres hiérarchisés de niveau width=length Largeur de la table. Constantes Notations action=URI URI de la page de traiement.
... respectif 1, 2, 3, 4 ,5 ,6. symboliques RVB
</H1>|</H2>|...</H6> (1 = gros, 6 = petit). border=entier Épaisseur de la bordure. method=get|post Méthode de soumission des données :
Black "#000000"
"get" : données concaténées à l'URI.
<P param...> ... </p> Paragraphe. bgcolor=couleur Couleur d'arrière plan. "post" : données transmise dans le corps de
Silver "#C0C0C0"
la requête
align=alignement Couleur du texte. cellspacing=length Taille d'espace des cellules.
Gray "#808080"
target=frame Nom du cadre qui affichera le résultat.
title=texte Texte de l'info bulle. cellpadding=length Taille d'espacement entre la
bordure d'une cellule et son White "#FFFFFF"
<input params...> Composant de formulaire.
<br> Retour de ligne forcé. contenu. Maroon "#800000"
type=type Type de composant :
<pre> ... </pre> Texte pré-formaté (tags html ignorés). dir=direction "LTR" : cellules de gauche à Red "#FF0000" text : ligne de texte simple,
droite (défaut), password : mot de passe,
<em> ... </em> Texte en emphase (italique). "RTL" : cellules de droite à Purple "#800080" checkbox : boite à cocher,
gauche. radio : bouton radio,
<strong> ... </strong> Texte en gras. Fuchsia "#FF00FF" submit : bouton de soumission,
<thead>...</thead> Groupement d'en-tête.
<blockquote param...> ... Citation image : bouton de soumission graphique,
Silver "#C0C0C0"
</blockquote> <tfoot>...</tfoot> Groupement de pied de table. reset : bouton de réinitialisation,
Green "#008000" bouton : bouton simple,
cite=URI URI de la source de la citation. <tbody>...</tbody> Groupement corps de table. hidden : composant caché,
Lime "#00FF00" file : selecteur de fichier.
title=texte Texte de l'info bulle. <tr param...>...</tr> Ligne de corps,en-tête ou pied.
Olive "#808000" name=texte Nom du champ.
<HR params...> Insérer une ligne de séparation horiz. <th param...>...</th> Cellule d'en-tête (texte en
gras). Yellow "#FFFF00" value=texte Valeur par défaut du composant.
width=length Largeur de la ligne.
<td param...>...</td> Cellule de table. Navy "#000080" size=entier Taille en pixels ou en caractères
align=alignement Aligment de la ligne.
colspan=n Fusionne la cellule avec les n-1 Blue "#0000FF" maxlength=entier Longueur de saisie maximum.
size=entier Hauteur de la ligne en points. cellules de droite.
Teal "#008080" checked Composant radio ou checkbox activé.
Aide mémoire HTML/CSS

<A params...> ... </A> Lien hypertexte. rowspan=n Fusionne la cellule avec les n-1
cellules du dessous. Aqua "#00FFFF" src=URI URI de l'image (type image seulement)
href=URI URI du document pointé.
Witdh,border,bgcolor, <textarea params...> Zone de saisie de texte contenant texte
target=frame Nom du cadre qui doit recevoir le idem. texte initial initial.
document. Valeurs spéciales : cellspacing,cellpadding
</textarea>
"_blank" : nouvelle fenêtre, </table> Balise de fin de table.
"_self" : même cadre, name=texte Nom du champ.
"_parent" : cadre parent,
"_top" : cadre de plus haut niveau. Cadres rows=entier Nombre de lignes.

<frameset params...> Définir une disposition de frames. cols=entier Nombre de colonnes.


En-tête du document
<body param...> Ouverture du corps du document. rows="length,length..." Liste des largeurs des frames ("* " : le reste <select params...>... Liste de choix déroulante.
de la largeur disponible).
bgcolor=couleur Couleur d'arrière plan. name=texte Nom du champ.
cols="length,length..." Liste des hauteurs des frames ("* " : le reste
text=couleur Couleur du texte. de la largeur disponible). <option params...> Option de liste déroulante affichant
description [</option>] description.
link=couleur Couleur des liens. <frame params...>...</frame> Frame imbriquée.
value=texte Valeur de l'option de choix.
alink=couleur Couleur du lien cliqué. src=URI URI du document imbriqué.
</select> Fin de description de liste de choix.
vlink=couleur Couleur du lien visité. noresize Empêche l'utilisateur de retailler le cadre
<button params...> Transforme code en bouton
text=couleur Position d'alignement de l'image. Valeurs scrolling=auto|yes|no Affichage des ascenseurs : code </button>
possible : bottom,middle,top,left,right auto : si nécessaire,
no : pas d'ascenseur, name=texte Nom du champ.
</body> Fermeture du corps du document. yes : ascenseurs toujours affichés.
type=type Type de bouton : button|submit|reset.
Frameborder = {0, 1} Affichage de la bordure du cadre (1) ou non
(0). </form> Fin du formulaire.
Corps du document
Marginwidth=entier Taille des marges gauche et droite.
<body param...> Balise d'ouverture du corps.
Marginheight=entier Taille des marges haute et basse. Listes, énumérations
bgcolor=couleur Couleur d'arrière plan.
<noframe> ... </noframe> Code HTML à interpréter si les cadres ne <ul> Balise d'ouverture de liste.
text=couleur Couleur du texte. sont pas supportés par le navigateur.
<li> ... [</li>] Balise d'élément de liste.
link=couleur Couleur des liens. </frameset> Fin de disposition de frames.
</ul> Balise de fermeture de liste.
alink=couleur Couleur du lien cliqué.
<ol> Balise d'ouverture de énumération.
vlink=couleur Couleur du lien visité.
Valeurs de paramètre <li> ... [/li>] Balise d'élément énuméré.
text=couleur Position d'alignement de l'image. Valeurs length Largeur en pixel ou en pourcentage de largeur disponible.
possible : bottom,middle,top,left,right </ol> Balise de fermeture d'énumération.
alignement Alignement du texte : left, center, right, justify.
</body> Balise de fermeture du corps.
Aide mémoire HTML (suite) Feuilles de style cascadées Polices
<style="text/css"> Note : selecteur correspond au nom d'un font font-style, font-variant, font-weight, font-size/line-height,
/* commentaire */ élément html (ex: BODY,P,H1,etc...), font-family, caption, icon, menu, message-box, small-
selecteur,selecteur ... {propriété: valeur; propriété: valeur; ... } propriété à un attribut (ex:font-size, border, caption, status-bar
Formatage de texte selecteur.classe {propriété: valeur; propriété: valeur; ... } etc...)
<center>...</center> Texte centré. </style> font-family family-name, generic-family

<TT> ... </TT> Texte en style télétype. font-size xx-small, x-small, small, medium, large, x-large, xx-large,
Arrières plans smaller, larger, length, %
<I> ... </I> Texte en italique. background Background-color, background-image, background-repeat, background-attachment,
background-position font-size-adjust none, number
<B> ... </B> Texte en gras.
background-attachment scroll, fixed font-stretch normal, wider, narrower, ultra-condensed, extra-
<U> ... </U> Texte souligné. condensed, condensed, semi-condensed, semi-expanded,
background-color color-rgb, color-hex, color-name, transparent expanded, extra-expanded, ultra-expanded
<S> ... </S> Texte barré.
background-image url, none font-style normal, italic, oblique
<BIG> ... </BIG> Texte en grosse police.
background-position top left, top center, top right, center left, center center, center right, bottom left, font-variant normal, small-caps
<SMALL> ... </SMALL> Texte en petite police. bottom center, bottom right, x-% y-%, x-pos y-pos
font-weight normal, bold, bolder, lighter, 100, 200, 300, 400, 500,
<font params...> ... </font> Changer le style du texte. background-repeat repeat, repeat-x, repeat-y, no-repeat 600, 700, 800, 900
size = entier Taille absolue ou relative
de la police. Espacements Classification
padding padding-top, padding-right, padding-bottom, clear left, right, both, none
color=couleur Couleur du texte. padding-left
cursor url, auto, crosshair, default, pointer, move, e-
padding-bottom, padding-top, padding-left, padding-right length, %
Images resize, ne-resize, nw-resize, n-resize, se-resize,
sw-resize, s-resize, w-resize, text, wait, help
<img param...> Balise d'insertion d'image Bordures
display none, inline, block, list-item, run-in, compact,
src=uri URI de l'image border-color color
marker, table, inline-table, table-row-group,
border-style None, hidden, dotted, dashed, solid, double, groove, ridge, inset, outset table-header-group, table-footer-group, table-
alt=texte Courte description
row, table-column-group, table-column, table-
width=entier Largeur d'affichage border-width Thin, medium, thick, length cell, table-caption

height=entier Hauteur d'affichage float left, right, none


Dimensions Contours
border=entier Largeur de la bordure de l'image. position static, relative, absolute, fixed
Height, width auto, length, % outline outline-color, outline-style, outline-width
(0 = pas de bordure).
visibility visible, hidden, collapse
line-height normal, number, length, % outline-color color, invert
align=aligment Position d'alignement de l'image.
max-height, max-width none, length, % outline-style none, dotted, dashed, solid, double,
alt=texte Texte affiché si l'image ne peut
être affichée.
groove, ridge, inset, outset Positionnement
min-height, min-width none, length, %
outline-width thin, medium, thick, length bottom, top, right, left auto, length, %
title=texte Texte de l'info bulle.
Tableaux clip shape, auto
border-collapse table collapse, separate Marges overflow Visible, hidden, scroll, auto
border-spacing length margin margin-top, margin-right, position static, relative, absolute, fixed
margin-bottom, margin-left
caption-side top, bottom, left, right vertical-align baseline, sub, super, top, text-top, middle, bottom,
margin-bottom, margin- auto, length, % text-bottom, length, %
empty-cells show, hide top, margin-left,
margin-right z-index auto, number
table-layout auto, fixed

Texte
color color
En savoir plus ... direction ltr, rtl
W3C recommandation http://www.w3.org/TR/html401/
letter-spacing normal, length
HTML reference http://www.w3schools.com/tags/default.asp
CSS2 reference http://www.w3schools.com/css/css_reference.asp text-align left, right, center, justify

text-decoration none, underline, overline, line-through, blink

text-indent length, %

text-shadow none, color, length

Aide mémoire text-transform none, capitalize, uppercase, lowercase

unicode-bidi normal, embed, bidi-override


HTML/CSS white-space normal, pre, nowrap

word-spacing normal, length

Vous aimerez peut-être aussi