1 juin 2008
Les balises les plus courantes
Liste de balises
Liste des balises HTML les plus courantes avec leurs attributs les plus utilisés.
Nom | Fonction |
<!-- --> | Permet de placer dans le code source d'une page des commentaires qui ne seront pas affichés dans le navigateur. |
Attributs : / | |
Exemple : <!-- Texte qui ne sera pas affiché par le navigateur --> | |
A | Crée lien hypertexte vers une autre page web ou vers un ancre. |
Attributs : href, name, target | |
Exemple : <a href="http://sourcedessai.canalblog.com" target="_blank">source d'essai</a> | |
B | Pour avoir du texte en gras. |
Attributs : / | |
Exemple : <b>Texte en gras...</b> | |
BIG | Augmente légèrement la taille du texte. |
Attributs : / | |
Exemple : <big>Texte un peu plus grand...</big> | |
BLOCKQUOTE | Applique un retrait à un texte. |
Attributs : / | |
Exemple : <blockquote>Texte qui sera en retrait...</blockquote> | |
BODY | Définit le corps (contenu affichable) de votre page web. Il doit venir juste après l'en-tête de la page HEAD. |
Attributs : bgcolor, background, alink, link, vlink, text | |
Exemple : <body>Contenu de votre page...</body> | |
BR | Ajoute un saut de ligne. |
Attributs : / | |
Exemple : Ligne1...<br>Ligne2... | |
CENTER | Centre le texte. |
Attributs : / | |
Exemple : <center>Texte centré</center> | |
DIV | Regroupe des éléments pour en contrôler la structure avec des feuilles de styles par exemple. |
Attributs : id, class | |
Exemple : <div class="menu">Contenu de votre menu</div> | |
FONT | Permet de mettre de modifier du texte (couleur, taille, police,...). |
Attributs : color, face, size | |
Exemple : <font size=3 color="#000000" face="Verdana">Texte en taille 3 écrit en noir avec la police Verdana</font> | |
FORM | Permet de créer un formulaire. |
Attributs : action, method, enctype, name, target | |
Exemple : <form action="fichier.php" method="POST">vos champs input</form> | |
H1 -> H6 | Définit 6 niveaux pour les titres. Chaque niveau possède son propre style. |
Attributs : align | |
Exemple : <h1>Titre</h1> | |
HEAD | Définit l'en-tête de votre document. Ces informations ne seront pas affichées par le navigateur. |
Attributs : / | |
Exemple : <head>en-tête de la page(titre, méta, style, script,...)</head> | |
HR | Place une séparateur horizontal. |
Attributs : align, size, width, color (seulement IE) | |
Exemple : <hr size=2 width=200 align="center"> | |
HTML | Indique que le fichier est un document HMTL. |
Attributs : / | |
Exemple : <html>tout le code de votre page</html> | |
I | Met le texte en italique. |
Attributs : / | |
Exemple : <i>texte en italique</i> | |
IMG | Ajoute une image dans votre page. |
Attributs : src, border, width, height, alt, align, hspace, vspace | |
Exemple : <img src="image.gif" border=0 width=88 height=31 alt="Logo"> | |
INPUT | Ajoute un champ de formulaire (plusieurs types sont disponibles). |
Attributs : type, name, value, checked, size, maxlength | |
Exemple : <input type="text" name="nom" value="Votre nom" size=25 maxlength=40> | |
LI | Crée un nouvel élément pour une liste. |
Attributs : value | |
Exemple : <li> Element de la liste(</>) | |
LINK | Permet de créer un lien vers un fichier externe (une feuille de style par exemple). |
Attributs : type, href, rel | |
Exemple : <link href="style.css" rel="stylesheet" type="text/css"> | |
MARQUEE | Permet de faire défiler un texte (IE uniquement). |
Attributs : direction, behavior, loop | |
Exemple : <marquee direction="right" behavior="scroll" loop=3>Texte défilant(</marquee>) | |
META | Définit des paramètres supplémentaires dans l'en-tête de votre page (très utile pour le référencement). |
Attributs : name, content, http-equiv, url (seulement IE) | |
Exemple : <meta name="description" content="Description pour les moteurs de recherches"> | |
OL | Crée une liste numérotée. |
Attributs : type, start | |
Exemple : <ol type="a">vos éléments de liste</ol> | |
OPTION | Crée un nouveau choix dans un SELECT. |
Attributs : value, selected | |
Exemple : <option value="choix1" selected>Post (</option>) | |
P | Constitue un nouveau paragraphe. |
Attributs : align, class | |
Exemple : <p align="center">texte du paragraphe (</p>) | |
SELECT | Crée une liste de sélection dans un formulaire. |
Attributs : name, multiple, size | |
Exemple : <select name="choix" size=3>vos balises OPTION</select> | |
SMALL | Diminue sensiblement la taille du texte (au contraire de BIG). |
Attributs : / | |
Exemple : <small>texte plus petit</small> | |
SPAN | Facilite la mise en forme (similaire à DIV pour des portions de textes plus courtes). |
Attributs : id, class | |
Exemple : <span class="normal">texte écrit en "normal"</span> | |
STRONG | Affiche le texte en gras (similaire à B). |
Attributs : / | |
Exemple : <strong>texte en gras</strong> | |
STYLE | Permet de définir des règles de style à utiliser sur le document. |
Attributs : type | |
Exemple : <style type="text/css">Eléments de style</style> | |
TABLE | Crée un tableau. |
Attributs : align, border, cellpadding, cellspacing, bgcolor, width, bordercolor (IE uniquement), background (IE uniquement) | |
Exemple : <table width="100%" border=3 cellpadding=3 cellspacing=0 align="center">vos cellules</table> | |
TD | Crée une nouvelle cellule dans un tableau. |
Attributs : align, valign, bgcolor, colspan, rowspan, width, height | |
Exemple : <td align="center" valign="top" colspan=2 width="50%">contenu</td> | |
TEXTAREA | Crée une zone de texte dans un formulaire. |
Attributs : rows, cols, name | |
Exemple : <textarea name="commentaire" cols=50 rows=5>votre texte</textarea> | |
TITLE | Détermine le titre qui sera affiché dans la barre de titre du navigateur. Cette balise doit venir dans l'en-tête (HEAD) de votre code |
Attributs : / | |
Exemple : <titre>texte dans la barre de titre</titre> | |
TR | Crée une nouvelle ligne dans un tableau pour y insérer des cellules (TD). |
Attributs : align, bgcolor, valign | |
Exemple : <tr>vos cellules</tr> | |
U | Affiche le texte en souligné. |
Attributs : / | |
Exemple : <u>texte souligné</u> | |
UL | Crée une liste à puces. |
Attributs : type, start | |
Exemple : <ul type="circle">Eléments de liste</ul> |
Publicité
Publicité
Commentaires