Go to: MicroSoft Tags References  English Help  English Page



Sommaire de l'Aide    Index alphabétique de l'Aide

• Aide des balises HTML •

Vous pouvez utiliser cette rubrique de deux façons:

 Index 






<!-- x --> Permet d'écrire un commentaire. Tout ce qui est inclus à l'intérieur (à la place du "x") n'apparaît pas sur l'écran du navigateur.
Index




<A …> x </A>: Anchor (Ancre) Construit un lien. Attributs courants:  Accessible depuis la barre d'outils.

Index




<B> x </B> Bold (Gras), met le texte en gras. Si la totalité du texte est déjà en gras, on peut obtenir de l'extra-gras en définissant une "graisse" supérieure dans la balise <STYLE> STYLE; ajoutez l'instruction:

B { font-weight:900 }.
On obtient CECI!

Index




<BGSOUND> Background Sound (Fond sonore).
Permet de jouer un fichier "son": *.WAV, *.MID, *.RMI. Rubrique Son Doit être placée dans la balise <HEAD> HEAD
Attribut habituel: LOOP="nombre" qui indique le nombre de fois que le morceau sera joué. "0": indéfiniment.
Anti-balise facultative.

Index




<BIG> x </BIG>Attention! Plus grand, augmente la taille du texte à la taille immédiatement supérieure par rapport à la taille en cours.
Par exemple, si le texte est en taille H4 (la taille par défaut), il passe en taille H3.

Index




• BODY •

<BODY …> x </BODY> Délimite le corps du fichier; cette balise, absolument indispensable, est automatiquement écrite par Netedit à la création d'un nouveau fichier HTML. Attributs courants:
Index




<BR> Break (Passer à la ligne), fait passer la suite du texte à la ligne suivante. Fonctionne aussi dans les éléments de listes et dans les cases d'un tableau. Aucune anti-balise!

Index




<CENTER> x </CENTER> Centrer, permet de centrer un élément: texte ou image quand l'alignement en cours est différent; très utile dans les listes, quand on veut incorporer une image centrée.

Index




<CITE> x <CITE> Citation. Utilisée telle-quelle, est équivalente à <EM>:EM le texte est simplement mis en italique. On peut obtenir une mise en valeur différente en plaçant <CITE> dans une balise <STYLE> STYLE ou une feuille de style externe "*.css".
Index




<BALISE CLASS="nom"> ATTRIBUT qui définit une CLASSE pour la balise concernée dans une balise <STYLE> STYLE ou feuille de style *.css.
L'écriture dans la feuille de style est:

BALISE.nom{ instructions-css-idoines }

CLASS est de plus en plus utilisé, car les nouveaux navigateurs (IE5.5 / 6.0 ® et Netscape 6.0®) ne reconnaissent plus certaines instructions css générales plus simples qui fonctionnent avec les versions immédiatement précédentes!
Index




<COMMENT> x </COMMENT> Commentaire, balise équivalente à: <!-- -->.
Bien qu'obsolète, elle fonctionne toujours, et peut être utile pour s'assurer qu'une erreur de code provient ou pas de la balise actuelle <!-- -->

Index




<DIR> Liste </DIR> Directory (Répertoire) : en fait, c'est une liste à puces simple.
Chaque élément doit être défini par une balise <LI> LI. N'accepte aucun attribut classique; la puce est toujours de type "disk" (disque plein).
Puce personnalisée:
Avec un petit dessin *.BMP, *.GIF. *.PNG ou *.JPG, vous pouvez créer une "puce" personnalisée, et la placer en tête de chaque élément de liste. Il faut pour cela placer une instruction dans une balise <STYLE> STYLE ou une feuille de style externe *.css :
DIR.nom{list-style-image:url("chemin/image.xxx");disk;}
L'indication: disk; permet de placer une puce classique si l'image était manquante.

L'écriture dans le fichier HTML devient:
<DIR CLASS="nom">

Avec <DIR>, les puces personnalisées ne fonctionnent pas toujours dans un fichier compilé en CHM: l'écriture du script de projet "*.hhp" doit être adaptée.
L'anti-balise </DIR> provoque un saut de ligne.

Index




<DIV …> x </DIV> Impose un alignement pour toute la partie du fichier incluse (à la place du "x").
Ne fonctionne qu'avec les attributs:
Index




<EM> x </EM> Emphasis (mettre en valeur), permet de distinguer facilement une partie de texte. Utilisée telle-quelle, le texte est simplement mis en italique. Il est bien plus intéressant de l'utiliser dans une balise <STYLE> STYLE ou feuille de style externe (*.css) avec l'instruction:
EM {font-weight:attribut-valeur;color:couleur;text-decoration:attribut-valeur }.
Cela permet une présentation très homogène, et évite de répéter les balises de style / couleur à chaque partie de texte à distinguer.

Index




<EMBED …> Embed (Intégrer un effet...):
permet d'ajouter un effet Multimédia (Son, Vidéo...) à votre page. Rubrique Embed
 Attributs nécessaires: Anti-balise facultative.

Index




• FONT •

<FONT …> x </FONT> Fonte, police de caractères. Définit la police de caractères pour le texte inclus dans la balise (x). Nécessite des attributs:
Index




<FRAME …> Définit un cadre (fenêtre secondaire) sur votre page HTML. S'utilise à l'intérieur de la balise suivante <FRAMESET>. Elle utilise de nombreux attributs. Les plus courants:Anti-balise facultative.

Index




<FRAMESET …> x </FRAMESET> Etablir un (des) cadres(s). Permet la construction d'une page comportant un ou plusieurs cadres. Fichier HTML muni de cadres Les attributs suivants permettent de définir globalement les caractéristiques du (des) cadre(s) de la page:
Index




<H'n'> x </H'n'> Height, hauteur de la police de caractères en tailles standards.
Index




• HEAD •

 <HEAD> x </HEAD> Entête du fichier. Ses attributs propres sont peu utilisés; en fait, <HEAD> contient surtout les balises suivantes:
Index




<HR …> place une ligne de séparation dans le texte. On peut ajouter les attributs: gère les lignes de séparation: menu "HTML" "Style" "Ligne de séparation": Ligne de séparation
Anti-balise facultative.

Index




• HTML •

 <HTML> xxx </HTML>
Index




<I> x </I> Met le texte en italique. Disponible sur la barre d'outils.

Index



• IMG •

<IMG …> Permet d'insérer une image Rubrique Image (et aussi une animation vidéo) dans la page. Elle possède de nombreux attributs: Anti-balise facultative.

Index




<LI> Liste, ajoute un élément à une liste. S'utilise avec les balises de construction de listes:
<UL>UL  <OL>OL  et <DIR>DIR. Il existe des attributs, mais peu utilisés...
Il est très pratique de préparer un bouton pour <LI>
Anti-balise facultative.

Index




<LINK> Lien ressource, s'utilise essentiellement pour définir un feuille de style externe. écrit cette balise avec les attributs nécessaires:
<LINK REL=STYLESHEET HREF="chemin/fichier.css" TYPE="text/css">

 Pour l'obtenir: menu HTML Feuille de Style "Link".
 Ne peut être placée que bans la balise <HEAD> HEAD
Anti-balise facultative.

Index




• MAP •

 <MAP …> zzz </MAP> "Carte" des zones actives pour une image réactive. construit automatiquement les "Maps"Rubrique Image réactive. Exemple de "Map" ci-dessous:

<IMG SRC="icone.bmp" HEIGHT="60" WIDTH="46" USEMAP="#icone" BORDER="0">
<MAP NAME="icone">
<AREA HREF="#titre" SHAPE="rect" COORDS="43,58,4,36" ALT="titre">
<AREA HREF="#timbre" SHAPE="rect" COORDS="7,4,33,33" ALT="timbre">
</MAP>

L'anti-balise </MAP> provoque un saut de ligne.
Index




• MARQUEE •

 <MARQUEE …> texte </MARQUEE> Animation de texte.
De nombreux attributs permettent de définir l'animation du texte: écrit la balise <MARQUEE> -simplifiée, mais que vous pourrez adapter à votre gré- depuis:
menu HTML Effets Texte animé (IE).
Cette balise ne fonctionne que sous MS-IE® et quelques navigateurs "légers" tel que LEM de R. Remblain.

Index




<META …> Spécifie la page pour les moteurs de recherche. Veuillez consulter la rubrique spéciale Rubrique - Meta-
écrit automatiquement ces balises, exemple de celles du présent fichier:

<META HTTP-EQUIV="Content-Type" CONTENT="text/html;CHARSET=iso-8859-1">
<META NAME="author" CONTENT="S. Morey & C. Charries">
<META NAME="copyright" CONTENT="XnView,Corel3.0,Netedit7.2,Win.Commander4.54(Re)">
<META NAME="creation_date" CONTENT="20/09/2001">
<META http-equiv="content_language" CONTENT="fr/en">
<META NAME="generator" CONTENT="Netedit 7.2">


Index




<NOFRAMES> texte </NOFRAMES> Voir: <FRAMESET> FRAMESET

Index




• OL •

<OL …> liste </OL> Ordered List (Liste ordonnée).
Chaque nouvelle ligne est ajoutée par une balise <LI>LI  <OL> utilise deux attributs courants:

 TYPE="valeur", indique de quelle façon les lignes seront référencées:  START="valeur", suivant le type de liste, on choisit le premier symbole (chiffre ou lettre) pour une première liste par exemple "1" ou "A"; si vous voulez ensuite intégrer un élément (par exemple une sous-liste à puces ou une image) et reprendre la numérotation, vous créez alors une seconde <OL> qui démarre au symbole suivant le dernier de la première liste.
 Exemple de codes: <OL TYPE="1" START="1"> <LI>Voici une liste ordonn&#233;e, <LI>Mais je vais vous montrer nos logos: </OL> <CENTER> <IMG SRC="toile-fr.gif">&#160;&#160;&#160; <IMG SRC="hibou-a.gif"> </CENTER> <OL TYPE="1" START="3"> <LI>Et la liste continue, <LI>Pratique, n'est-ce pas? </OL>  Affichage à l'écran:
  1. Voici une liste ordonnée,
  2. Mais je vais vous montrer nos logos:
    
  1. Et la liste continue,
  2. Pratique, n'est-ce pas?
écrit les listes: menu HTML Style Listes Choisir le type de liste ou la balise <LI>
On peut aussi préparer un bouton Barre d'outils perso. avec le code de <OL> et ses attributs comme:

<OL TYPE="x" START="y"></OL>
qu'il suffit de compléter suivant les cas...
L'anti-balise </OL> provoque un saut de ligne.

Index




<P …> x  </P>  Paragraphe, délimite un paragraphe.
Anti balise facultative. Toutefois, <P> accepte l'attribut Align="valeur" ("center", "right", "left"); dans ce cas, l'anti-balise </P> est nécessaire.

Index




<S> x </S> Strike (barré); écrit le texte barré. Exemple: Euuu... Je me suis trompé!

Index




<SMALL> x </SMALL> Plus petit, diminue la taille de la fonte à la taille immédiatement inférieure.
Exemple: C'est plus petit!
Il est pratique de préparer un bouton pour écrire cette balise.

Index




<SPAN> xxx </SPAN> Permet de ne pas appliquer les instructions d'une feuille de style:
<SPAN STYLE="instructions"> xxx </SPAN>

Pour l'obtenir: menu HTML   Feuille de Style  "Span"
<SPAN> ne fonctionne pas avec tous les navigateurs…

Index




<STRONG> x </STRONG> Plus fort utilisée telle-quelle, met le texte en gras.
Si la totalité du texte est déjà en gras, on peut obtenir un niveau de gras supérieur avec <STRONG> dans une balise <STYLE>STYLEou une feuille de style externe *.css avec l'instruction:
STRONG { font-weight:900 }

Index



<SUB …> x </SUB> Indice. Exemple: C2H5OH
Attribut courant:
CLASS="nom" pour définir les caractères de <SUB> dans STYLE ou feuille de style *.css


Index



<SUP …> x </SUP> Exposant. Exemple: 106
Attribut courant:
CLASS="nom" pour définir les caractères de <SUP> dans STYLE ou feuille de style *.css


Index



• STYLE •

<STYLE …> instructions-css </STYLE> Permet de définir un style pour des éléments dans tout le fichier, sans re-écrire les balises à chaque élément semblable. Exemple:
<STYLE TYPE="text/css">
<!--
H1 { color:red }
BODY.gr{ font-weight:700 }
STRONG { font-weight:900 }
// -->
</STYLE>

qui donnera, respectivement: écrit la balise <STYLE>: menu HTML Feuille de Style "Style".

Index




• TABLE •

<TABLE …> balises-annexes </TABLE> Tableau. La balise générale pour construire un tableau; c'est une structure assez complexe à réaliser "à la main"! En effet, plusieurs balises annexes sont nécessaires pour chaque case du tableau, et peuvent avoir elles-mêmes des attributs... Aussi l'écriture de la construction du tableau a t-elle été particulièrement bien étudiée et automatisée dans :  Exemple simple de codes:
<TABLE WIDTH="40%" BORDER="3" BGCOLOR="#80FF80"> <TR> <!-- ligne 1 colonne 1 --> <TD ALIGN="center"> Case de la ligne1 <BR>Colonne 1 </TD> <!-- ligne 1 colonne 2 --> <TD ALIGN="center"> Case de la ligne 1 <BR>Colonne 2 </TD> </TR> <TR> <!-- ligne 2 colonne 1 --> <TD ALIGN="center"> Case de la ligne 2<BR>Colonne 1 </TD> <!-- ligne 2 colonne 2 --> <TD ALIGN="center"> Case de la ligne 2<BR>Colonne 2 </TD> </TR> </TABLE> Affichage à l'écran:
Case de la ligne1
Colonne 1
Case de la ligne 1
Colonne 2
Case de la ligne 2
Colonne 1
Case de la ligne 2
Colonne 2

 Pour obtenir les boîtes de dialogue qui construisent un tableau:
Menu HTML   Tableau  Tableau.
Au clavier: F9

Index




<TITLE> texte </TITLE> Le titre de la page. Il est affiché dans la barre de titre du navigateur, et aussi parfois dans la barre d'état. Cette balise ne peut être employée qu'à l'intérieur de la balise <HEAD>  .
Index




<U> x </U> Underline (Souligné). Ecrit le texte en souligné . Disponible depuis la barre d'outils Barre d'outils

Index




<UL …> liste </UL>Unordered List, liste "à puces"; elle n'utilise qu'un seul attribut: TYPE="valeur" qui définit le type de puce, "disk" (disque plein), "circle", (cercle vide), "square" (puce carrée). Exemple:

"disk"
"circle"
"square"
Chaque nouvelle ligne est ajoutée par une balise <LI>LI
écrit les listes: menu HTML Style Listes Choisir le type de liste ou la balise <LI>

On peut aussi préparer un bouton avec le code de <UL> et son attribut comme:
<UL TYPE="x"></UL> qu'il suffit de compléter suivant les cas...

Puce personnalisée:
Avec un petit dessin *.PNG, *.BMP, *.GIF ou *.JPG, vous pouvez créer une "puce" personnalisée, et la placer en tête de chaque élément de liste. Il faut pour cela placer une instruction dans une balise <STYLE> STYLE ou une feuille de style externe *.css :
UL.nom{list-style-image:url("chemin/image.xxx");disk;}
L'indication: disk; permet de placer une puce classique si l'image était manquante.

L'attribut "type=x" est alors remplacé dans le fichier HTML par:
<UL CLASS="nom">

Exemple: Avec <UL>, les puces personnalisées ne fonctionnent pas toujours dans un fichier compilé en CHM: l'écriture du script de projet "*.hhp" doit être adaptée.
L'anti-balise </UL> provoque un saut de ligne.

Index




<XMP> exemple de texte codé en HTML </XMP> Exemple, bien que déclarée obsolète, est toujours utile pour afficher un exemple de codes... De plus, les balises actuelles censées la remplacer ne sont pas équivalentes ( rien à l'écran!). On peut lui donner une couleur et une graisse avec une instruction dans <STYLE>
Il est pratique de préparer un bouton pour <XMP>

 Inconvénients:
 L'anti-balise </XMP> provoque un saut de ligne,
 Police par défaut peu esthétique; pour la changer, seules des instructions pour l'attribut: CLASS="nom" dans une feuille de style "*.css" sont efficaces.
Pour un example de code court, codez les chevrons < > des balises.

Index













• Architecture d'une balise •

  1. <  Chevron d'ouverture,
  2.   Balise fondamentale,
  3. UN ESPACE
  4. 1° attribut
  5. "Valeur" entre guillemets
  6. UN ESPACE
  7. 2° attribut
  8. "Valeur" entre guillemets
  9. UN espace,
  10. n°... attribut,
  11. "Valeur" entre guillemets,
  12. >  Chevron de fermeture
  1. <  Chevron d'ouverture,
  2. / barre oblique: spécifie comme anti-balise,
  3.   Balise fondamentale,
  4. >  Chevron de fermeture.

Index



Sommaire de l'Aide   Index alphabétique de l'Aide   Index

Créé le 22/ 09 / 2001 • Mis à jour le: 30 / 12 /2001.
Aide de Netedit - ©Sébastien Morey & Claude Charries - 1999~2002.