Principal Commande HTML

Aide aux divers cours - Bruno GADRAT
Principales commandes en HTML
gadrat/cours/informatique/html/commandes.html - rev. 28/10/2000
Structure générale du code | Principales actions
Structure générale
<HTML>
<HEAD>
<TITLE>
Le titre de la fenêtre
</TITLE>
</HEAD>
<BODY>
Votre oeuvre avec autant de <...> </...> inclus les uns
dans les autres que vous le voulez. C'est dans cette partie
que se trouve le gros du travail.
</BODY>
</HTML>
À chaque fois que vous voulez afficher autre chose que du texte de cette taille non accentué;
vous devez signaler le début de l'action et la fin de l'action:
<ACTION> texte sur lequel l'action agit </ACTION>
Vous remplacerez le mot ACTION par le mot clef approprié.
Notez tout de suite deux exceptions qui n'agissent pas sur autre chose et qui n'ont donc pas de
fermeture: (il y en a d'autres vous les découvrirez bien assez tôt
<br> qui provoque le retour à la ligne
<hr> qui trace une ligne horizontale
Les principales actions que vous utiliserez

 Mettre un titre
 Mettre des accents
 Style d'écriture
 Retours à la ligne et paragraphes
 Faire une liste
 Inclure une image
 Faire un renvoi vers un autre fichier ou un message
 Faire un tableau
Autres actions parfois utiles

 Faire un renvoi vers une section du fichier affiché ou d'un autre fichier
 Faire remplacer le fichier affiché par un autre après un temps déterminé
 Forcer la largeur de page dans l'affichage
Actions principales
Mettre un titre
Titre H1
s'écrit :
<H1>Titre H1 </H1>
Les titres sont séparés automatiquement du reste du texte.
Titre H2
Titre H3
Titre H4
Titre H5
Titre H6
Le texte ordinaire est écrit en vrac sans se soucier ni des espaces ni des retours à la ligne ni de
sa présentation générale dans le fichier html.
Les accents
éèêàû
é è ê à û
liste de tous les accents

Les styles d'écriture
Italique bold underline
Texte en italique avec le T souligné et le e gras. Il est possible d'introduire ces
enrichissements dans les titres.
<i> Italique </i> <b> Bold gras </b> <u> Underline souligné </u>
Sauts de lignes et paragraphes

On peut
introduire
des sauts de lignes.
<br>
On peut aussi construire des paragraphes isolés les uns des autres.
<p> Paragraphe </p>
Pour sauter une ligne il faut faire un paragraphe avec un espace insécable
<P> </P>

<pre>
Une mise en évidence est aussi possible
et
prend tel qu'il est
le texte inscrit
</pre>

Listes
Liste numérotée
1. un
2. deux
3. trois
<OL>
<LI>un
<LI>deux
<LI>trois
</OL>

Liste simple
 un
 trois
 douze
<UL>
<LI>un
<LI>deux
<LI>trois
</UL>

Liste emboîtée
 un
 trois
o un
o trois
o douze
 douze
 vingt
<UL>
<LI>un
<LI>trois
<UL>
<LI>un
<LI>trois
<LI>douze
</UL>
<LI>douze
<LI>vingt
</UL>

Liste de définitions
Sujet
définition ligne 1
définition ligne 2
Autre sujet
définition l permettant un fort remplissage avec les mêmes caractéristiques que les
autres textes ordinaires.
<DL>
<DT>Sujet
<DD>définition ligne 1
<DD>définition ligne 2
<DT>Autre sujet
<DD>définition l permettant un fort remplissage avec les
mêmes caractéristiques que les autres textes
ordinaires.
</DL>

Inclure une image dans le texte
Pour mettre une image dans le texte :
<IMG SRC="http://www.designvegetal.com/gadrat/images/4CM/0/A12.JPG"
ALT="[Seringat_en_fleurs]" ALIGN=middle>
Pour un fichier situé dans le même répertoire sans alignement particulier on peut
écrire:
<IMG SRC="../ordi.GIF" WIDTH=77 HEIGHT=62 ALIGN=bottom>
alt=[texte_de_remplacement] sert à ceux qui n'ont pas la chance de voir les

images.
align=middle situe une ligne de texte au milieu de l'image essayez aussi

align=right et align=left pour que le texte soit en colonne à côté de l'image.
Pour décoller le texte de l'image on ajoute vspace=5 pour l'écart vertical et
hspace=5 pour l'écart horizontal.
<IMG SRC="../../../images/4CM/2000/04_avril/A2000040713.jpg" ALT="Cornus-rameaux"

WIDTH=71 HEIGHT=106 BORDER=0 ALIGN=left hspace=10 vspace=5>
Pour une position précise dans la page il faut utilier un tableau.
Appeler un autre fichier

Pour appeler un autre fichier dans le réseau avec un lien à cliquer sur : Le site végétaux et
paysage
<A HREF="http://www.designvegetal.com/gadrat/index.html">
Le site végétaux et paysage
</A>
Pour appeler un fichier situé dans le même répertoire comme celui sur les accents on peut
écrire:
<A HREF="accents.html">accents</A>
../ permet de remonter d'un répertoire pour entrer dans un répertoire à partir de celui où l'on
est il faut écrire son nom suivi de /
<A HREF="../repertoire_html/accents.html">accents</A>
Pour appeler des fichiers dans différents cadres
Envoyer un message avec un lien dans le texte

Ouvrir une fenètre de message à envoyer avec un lien: cours designvegetal.com
<A HREF="../../../../contact.html">
cours designvegetal.com
</A>
Pour envoyer un message tout rempli avec un lien à cliquer: Envoyer le message
mailto:un@serveur1, deux@serveur2 ?
cc=trois@serveur3 &
bcc=quatre@serveur4 &
subject=Le sujet &
body=Le%20texte%20du%20message%0d%0aligne%20deux
<A HREF="mailto:un@serveur1, deux@serveur2?

cc=trois@serveur3&bcc=quatre@serveur4&subject=Le sujet&body=Le%20texte%20du
%20message%0d%ligne%20deux">
Envoyer le message
</A>
remarques: l'option body ne marche pas avec netscape 2, Il faut aussi oublier les accents.
Faire un tableau
B C
Ici on met le texte de la
1 Dans cette case un lien avec le fichier accents
case B1
Vous pouvez voir comment j'ai réduit l'image de la case d'à côté en
2
regardant le fichier source
<TABLE BORDER=3 CELLPADDING=1>
<TR>
<TD>

</TD><TD>
B
</TD><TD>
C
</TD></TR>
<TR>
<TD>
1
</TD><TD>
Ici on met le texte de la case B1
</TD><TD>
Dans cette case un lien avec le fichier
<A HREF="accents.html">accents</A>
</TD></TR>
<TR>
<TD>
<P>2
</TD><TD>
<IMG SRC="../ordi.GIF" WIDTH=20 HEIGHT=20 ALIGN=bottom>
</TD><TD>
Vous pouvez voir comment j'ai
réduit l'image de la case
d'à côté
Largeur totale du
</TD></TR> tableau 200
</TABLE> Hauteur totale du
tableau 100
Cette fonction permet de placer des éléments avec une bonne
précision sur la page en utilisant les option de largeur et Largeur de la cellule |
hauteur 150 |
Hauteur de la cellule |
<TABLE BORDER=1 WIDTH=200 HEIGHT=150 align=right > 100 |___
<TR>
<TD WIDTH=150 HEIGHT=100> Si le logiciel accepte |¨¨¨¨¨¨
Largeur totale du tableau 200<BR> des paramètres |
Hauteur totale du tableau 100<BR> supplémentaire
<BR> align=right
Largeur de la cellule 150<BR>
Hauteur de la cellule 100
</TD>
<TD VALIGN=bottom HEIGHT=100>
|<BR>
|<BR>
|<BR>
|___
</TD>
</TR>
<TR>
<TD WIDTH=150>
<CENTER>Si le logiciel accepte des paramètres
supplémentaire align=right</CENTER>
</TD>
<TD VALIGN=top>
|¨¨¨¨¨¨<BR>
|
</TD>
</TR>
</TABLE>
Autres actions parfois utiles
Faire un renvoi vers une section d'un fichier
1. Il faut d'abord créer une ancre dans le fichier au début de la section sur laquelle on
veut renvoyer
<A NAME="nom_ancre"></A>
2. Il faut ensuite appeler cette ancre dans un lien de fichier avec le symbole #
<A HREF="#nom_ancre">Aller vers le début de la section nommé nom_ancre </A>
On peut appeler #nom_ancre directement si elle est dans le fichier affiché ou l'indiquer pour
un autre fichier
<A HREF="nom_fichier#nom_ancre">Aller vers le début de la section nommé nom_ancre du

fichier nom_fichier</A>
<A HREF="http://serveur/chemin/fichier#nom_ancre">Pointer sur une section ailleurs dans
le web</A>
Forcer la largeur de page dans l'affichage

Utilisez la fonction de table en lui précisant sa largeur et placez un élément à l'intérieur.
La largeur d'un écran ordinaire est de 640 points par 480 points
La largeur d'une page (zone imprimée) est de 531 points (en comptant les marges par défaut
sur du papier format lettre)
Insérer une musique

<embed src="fichier.mid" width=0 height=0 autostart=true loop=1>

Principal Commande HTML

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

Principal Commande HTML

Transféré par

Droits d'auteur :

Formats disponibles

Aide aux divers cours - Bruno GADRAT

Principales commandes en HTML

gadrat/cours/informatique/html/commandes.html - rev. 28/10/2000

Structure générale du code | Principales actions

Les principales actions que vous utiliserez

Autres actions parfois utiles

Les titres sont séparés automatiquement du reste du texte.

&eacute; &egrave; &ecirc; &agrave; &ucirc;

liste de tous les accents

Sauts de lignes et paragraphes

<p> Paragraphe </p>

Inclure une image dans le texte

Pour mettre une image dans le texte :

<IMG SRC="../ordi.GIF" WIDTH=77 HEIGHT=62 ALIGN=bottom>

alt=[texte_de_remplacement] sert à ceux qui n'ont pas la chance de voir les

align=middle situe une ligne de texte au milieu de l'image essayez aussi

<IMG SRC="../../../images/4CM/2000/04_avril/A2000040713.jpg" ALT="Cornus-rameaux"

Pour une position précise dans la page il faut utilier un tableau.

Appeler un autre fichier

Pour appeler des fichiers dans différents cadres

Envoyer un message avec un lien dans le texte

<A HREF="mailto:un@serveur1, deux@serveur2?

<A HREF="nom_fichier#nom_ancre">Aller vers le début de la section nommé nom_ancre du

Forcer la largeur de page dans l'affichage

Insérer une musique

Vous aimerez peut-être aussi

é è ê à û