Chromosome Home Page

Création de pages Web

Exemples de tags HTML

 Observatoire de Genève
Tag HTML Affichage Remarques

Tags spéciaux
Correspondance des codes HTML composant la police de caractères Latin1    
Bonjour &nbsp &nbsp Monsieur Bonjour     Monsieur Espace forcé
Monsieur <!-- Bonjour --> Monsieur Monsieur Monsieur Commentaires n'apparaissant pas à l'affichage 
<HEAD>
<TITLE>Exemples de tags HTML</TITLE>
<META HTTP-EQUIV="distribution" CONTENT="global">
<META HTTP-EQUIV="copyright" CONTENT="Michel Crausaz 1999">
<META HTTP-EQUIV="reply-to" CONTENT="Michel.Crausaz@obs.unige.ch">
<META NAME="author" CONTENT="Michel Crausaz">
<META NAME="keywords" CONTENT="Observatoire de Genève, Crausaz, Chromosome">
<META NAME="description" CONTENT="Site personnel: photos, divers">
</HEAD>
Méta-Tags dans l'entête
keywords = mots clefs representant le contenu de la page (ou du site) destinés aux moteurs de recherches
description = Petit descriptif du contenu de la page (ou du site) 
<HEAD>
<TITLE>Exemples de tags HTML</TITLE>
  <STYLE type="text/css">
    BODY  { background-color: white; font-family: helvetica}
    PRE { font-family: monospace; font-size: 12pt }
    H1 { text-align: center; font-size: 18pt }
    H2 { text-align: left; font-size: 16pt }
    H3 { text-align: right; font-size: 14pt }
    H4 { font-size: 12pt }
    H5 { font-size: 10pt }
    H6 { font-size: 8pt }
    P  { font-size: 12pt }
  </STYLE>  
</HEAD>
Définition des polices et des tailles dans l'entête
Prime sur les déclarations dans <BODY>
<BODY BGCOLOR="#F6E4FF" TEXT="#BLACK" LINK="#0000FF" ALINK="#FF2020" VLINK="#FF00FF">


<BODY BACKGROUND="/icones/blue_paper.gif" TEXT="#BLACK" LINK="#0000FF" ALINK="#FF2020" VLINK="#FF00FF"> 		Attributs de la page. Les couleurs peuvent être données en hexa ou en lettres
BACKGROUND="charge une image comme fond de page"
BGCOLOR="couleur du font de la page"
TEXT="couleur texte"
LINK="couleur du link vierge"
ALINK="couleur du link sous le curseur de la souris"
VLINK="couleur du link déja visité"

Séparations
Bonjour<BR> Monsieur Bonjour
Monsieur 		Force un retour à la ligne
Bonjour<P> <P> <P> Monsieur<P> Dupanloup Bonjour

Monsieur

Dupanloup

 Aligne à gauche par défault le paragraphe suivant
Il est inutile d'en mettre deux de suite, seul le premier est pris en considération
Bonjour<P>&nbsp <P>&nbsp<P> Monsieur<P> Dupanloup Bonjour

 

 

Monsieur

Dupanloup

 Aligne à gauche par défault le paragraphe suivant
Le seul moyen pour sauter plusieur lignes est de faire suivre <P> par un espace: <P>&nbsp
Bonjour<P> Monsieur<P> Dupanloup Bonjour

Monsieur

Dupanloup

 Aligne à gauche par défault le paragraphe suivant
Bonjour<P ALIGN=CENTER> Monsieur</P> Dupanloup Bonjour

Monsieur

Dupanloup		 Aligne au centre le paragraphe suivant
Bonjour<P ALIGN=RIGHT> Monsieur</P> Dupanloup Bonjour

Monsieur

Dupanloup		 Aligne à droite le paragraphe suivant
Bonjour <HR> Bonjour Bonjour
Bonjour		 Le texte passe automatiquement à la ligne avant et après la ligne
Bonjour <HR SIZE="4"> Bonjour Bonjour
Bonjour		 Epaisseur de la ligne
Bonjour <HR SIZE="4" WIDTH="40"> Bonjour Bonjour
Bonjour		 Longeur de la ligne en pixel
Bonjour <HR SIZE="6" WIDTH="40%"> Bonjour Bonjour
Bonjour		 Longeur de la ligne en %
Bonjour <HR SIZE="6" WIDTH="40%" ALIGN=LEFT> Bonjour Bonjour
Bonjour		 Aligné à gauche
Bonjour <HR SIZE="6" WIDTH="40%" ALIGN=RIGHT> Bonjour Bonjour
Bonjour		 Aligné à droite

Structure du document
Monsieur <H1>Bonjour</H1> Monsieur Monsieur

Bonjour

Monsieur 		Saut de paragraphe avant et après le texte mis entre les balises
Aligné au centre par <STYLE> dans l'entête
<H2>Bonjour</H2> Monsieur

Bonjour

Monsieur 		Tag utilisé en général pour les titres
Aligné à gauche par <STYLE> dans l'entête
<H3>Bonjour</H3> Monsieur

Bonjour

Monsieur 		Tag utilisé en général pour les titres
Aligné à droite par <STYLE> dans l'entête
<H4>Bonjour</H4> Monsieur

Bonjour

Monsieur 		Aligné à gauche par défault
<H4 ALIGN=CENTER>Bonjour</H4> Monsieur

Bonjour

Monsieur 		Aligné au centre
<H4 ALIGN=RIGHT>Bonjour</H4> Monsieur

Bonjour

Monsieur 		Aligné à droite
<H5>Bonjour</H5> Monsieur
Bonjour
Monsieur 		Aligné à gauche par défault
<H6>Bonjour</H6> Monsieur
Bonjour
Monsieur 		Aligné à gauche par défault

Tailles et couleurs du texte
<FONT SIZE="6">Bonjour</FONT> Monsieur Bonjour Monsieur Le texte reste à la suite !
<FONT SIZE="5">Bonjour</FONT> Monsieur Bonjour Monsieur  
<FONT COLOR="GREEN" SIZE="4">Bonjour</FONT> Monsieur Bonjour Monsieur On peut varier les couleurs
<FONT COLOR="YELLOW" SIZE="3">Bonjour</FONT> Monsieur Bonjour Monsieur  
<FONT COLOR="RED" SIZE="2">Bonjour</FONT> Monsieur Bonjour Monsieur  
<FONT COLOR="RED" SIZE="1">Bonjour</FONT> Monsieur Bonjour Monsieur  

Tailles et couleurs
<FONT COLOR="BLUE" SIZE="-1">Bonjour</FONT> Monsieur Bonjour Monsieur A éviter
<FONT COLOR="BLUE" SIZE="+1">Bonjour</FONT> Monsieur Bonjour Monsieur A éviter

Style physique
<U>Bonjour</U> Monsieur Bonjour Monsieur Souligné
<STRIKE>Bonjour</STRIKE> Monsieur Bonjour Monsieur Barré
<I>Bonjour</I> Monsieur Bonjour Monsieur Italique
<B>Bonjour</B> Monsieur Bonjour Monsieur Gras (Bold)
<STRONG>Bonjour</STRONG> Monsieur Bonjour Monsieur Gras (Bold)
<BIG>Bonjour</BIG> Monsieur Bonjour Monsieur Gras et plus grand
<TT>Bonjour</TT> Monsieur Bonjour Monsieur Caractères de type machine à écrire (télétype) Attention police non proportionnelle

Style logique
<CITE>Bonjour</CITE> Monsieur Bonjour Monsieur Citation
<CODE>Bonjour</CODE> Monsieur Bonjour Monsieur Exemple de programme informatique
Caractères de type machine à écrire (télétype) Attention police non proportionnelle
<DFN>Bonjour</DFN> Monsieur Bonjour Monsieur Définition d'un terme
<EM>Bonjour</EM> Monsieur Bonjour Monsieur Mise en valeur d'un texte
<KBD>Bonjour</KBD> Monsieur Bonjour Monsieur Illustre une saisie au clavier
<SAMP>Bonjour</SAMP> Monsieur Bonjour Monsieur Exemple de texte
Caractères de type machine à écrire (télétype) Attention police non proportionnelle
<VAR>Bonjour</VAR> Monsieur Bonjour Monsieur Présentation d'une variable dans un contexte informatique

Style paragraphe
<ADDRESS>Bonjour</ADDRESS> Monsieur
Bonjour
Monsieur 		Pour une adresse ou une signature
Monsieur <BLOCKQUOTE>Bonjour</BLOCKQUOTE> Monsieur Monsieur
Bonjour
Monsieur 		Illustre une saisie au clavier
Saut de paragraphe avant et après le "Bonjour"		 
 Monsieur  
<PRE>
Bonjour
		<B>vous</B>
	ici ?
</PRE>
 Monsieur
Monsieur 
Bonjour
		vous
	ici ?
Monsieur 		Respecte et affiche le texte comme il a été saisi
Saut de paragraphe avant et après le texte mis entre les balises
Un tag HTML <B>texte</B> entre les balises <PRE> sera interprété par le browser sauf si il est écrit:

&#60;B&#62; texte &#60;&#47;B&#62;

Listes descriptives

 
Vous ici
<UL>
  <LI>Bonjour
  <LI>Monsieur
<UL>
Quel hasard
 Vous ici
  • Bonjour
  • Monsieur
Quel hasard		 Indentation
Saut de paragraphe avant et après <UL>texte<UL>		 
Vous ici
<UL TYPE=CIRCLE>
  <LI>Bonjour
  <LI>Monsieur
<UL>
Quel hasard
 Vous ici
  • Bonjour
  • Monsieur
Quel hasard		 Indentation 
Vous ici
<UL TYPE=DISC>
  <LI>Bonjour
  <LI>Monsieur
<UL>
Quel hasard
 Vous ici
  • Bonjour
  • Monsieur
Quel hasard		 Indentation 
Vous ici
<UL TYPE=SQUARE>
  <LI>Bonjour
  <LI>Monsieur
<UL>
Quel hasard
 Vous ici
  • Bonjour
  • Monsieur
Quel hasard		 Indentation 
Vous ici
<OL>
  <LI>Bonjour
  <LI>Monsieur
<OL>
Quel hasard
 Vous ici
  1. Bonjour
  2. Monsieur
Quel hasard		 Indentation avec des chiffres par défault
Saut de paragraphe avant et après <OL>texte<OL>		 
Vous ici
<OL TYPE=a>
  <LI>Bonjour
  <LI>Monsieur
<OL>
Quel hasard
 Vous ici
  1. Bonjour
  2. Monsieur
Quel hasard		 Indentation avec des minuscules 
Vous ici
<OL TYPE=A>
  <LI>Bonjour
  <LI>Monsieur
<OL>
Quel hasard
 Vous ici
  1. Bonjour
  2. Monsieur
Quel hasard		 Indentation avec des majuscules 
Vous ici
<OL TYPE=I>
  <LI>Bonjour
  <LI>Monsieur
<OL>
Quel hasard
 Vous ici
  1. Bonjour
  2. Monsieur
Quel hasard		 Indentation avec des chiffres romains 
Vous ici
<OL TYPE=1>
  <LI>Bonjour
  <LI>Monsieur
<OL>
Quel hasard
 Vous ici
  1. Bonjour
  2. Monsieur
Quel hasard		 Indentation avec des chiffres arabes 
Vous ici
<DL>
  <DT>Bonjour
    <DD>Madame Dubois
  <DT>Bonjour
    <DD>Monsieur Dupont
<DL>
Quel hasard
 Vous ici
Bonjour
Madame Dubois
Bonjour
Monsieur Dupont
Quel hasard		 Liste descriptive
Saut de paragraphe avant et après <DL>texte<DL>		 
Vous ici
<DL COMPACT>
  <DT>Bonjour
    <DD>Madame Dubois
  <DT>Bonjour
    <DD>Monsieur Dupont
<DL>
Quel hasard
 Vous ici
Bonjour
Madame Dubois
Bonjour
Monsieur Dupont
Quel hasard		 Liste descriptive
Saut de paragraphe avant et après <DL>texte<DL>

Divers

Tout compléments ou adjonctions de links seront les bienvenus, merci
Création de pages Web Chromosome Observatoire de Genève
   Dernière modification: 17.05.2006
   Copyright © 1995-2024 Michel Crausaz, Tous droits réservés
   Réalisation: Michel Crausaz - Observatoire de Genève
Page précedente    Haut de la page    Page suivante   
Recherche dans la page