Programmation en HTML

   

chapitre 4-b

 

Les polices de caractères

     
   

Cette partie a pour objectif la description les différents marqueurs permettant de mettre des caractères d'une page Web en gras, italique... .

Généralités sur les caractères

La police des caractères est unique sur Internet et quelque soit le browser utilisé, elle apparaîtra toujours de la même façon. On peut cependant changer sa taille, ou donner un effet de police de machine à écrire.
 
<tt></tt>

Ce marqueur est l'un de ceux qui modifient l'apparence du texte. Vous pouvez constater que ces quelques mots sont sous le format style "machine à écrire". Elles ont été encadrées par les marqueurs <tt> </tt>.


 

<hx> </hx>

La présentation d'une page commence généralement par le choix et l'usage d'entêtes prédéterminés qui s'échelonnent de <h1> à <h6> (h pour header). Ces marqueurs comprennent un choix de taille (1 à 6),
le caractère est gras et un passage à la ligne automatique.

<h1>Header de taille 1</h1>

Header de taille 1



<h2>Header de taille 2</h2>

Header de taille 2



<h3>Header de taille 3</h3>

Header de taille 3



<h4>Header de taille 4</h4>

Header de taille 4



<h5>Header de taille 5</h5>
Header de taille 5


<h6>Header de taille 6</h6>
Header de taille 6

Il est à noter que les headers peuvent recevoir un attribut :align.
Align va changer la place du titre dès l'instant où il aura comme valeur, soit left, center, right, ou justify .

 
<font> </font>

- Ce marqueur permet grâce à l'attribut size d'augmenter ou de réduire la taille des caractères.
- En associant l'attribut
color (qui doit recevoir un code hexadécimal), on peut mettre une série de caractères dans une couleur différente.

- En y associant l'attribut face qui doit recevoir le nom d'une police courante existante sur l'ordinateur du client Web (pour avoir plus de chance on peut en mettre plusieurs de même type par exemple <font face="Arial, Helvetica, sans-serif">

<font size=+2 color=339999 face="Arial, Helvetica, sans-serif">
Plus gros de 2 unités et couleur pétrole sans-serif
</font>

Plus gros de 2 unités et couleur pétrole sans-serif

 
 

Caractères gras

Il existe deux possibilités pour mettre des caractères en gras :
  • <b></b>
    <b>Caractères gras</b> ===> Caractères gras
  • <strong></strong>
    indique une insistance plus forte sur un mot qui se trouve dans un paragraphe     <===<strong>paragraphe</strong>
Caractères italiques
Comme les caractères gras, il existe deux possibilités pour mettre les caractères en italiques :
  • <i></i>
    <i>Caractères italiques</i> ===> Caractères italiques
  • <em></em>

    <em>Caractères italiques</em> ===> Caractères italiques

    indique une insistance plus forte sur un mot qui se trouve dans un paragraphe.

Il est tout à fait possible, bien évidemment,de combiner les caractères gras & italiques.
 Autres caractères
<address> </address> 
 
Permet d'apposer sa signature au bas d'une page Web.
On peut aussi y mettre ses Copyrights, et son adresse e-mail.
<address>Marcel Fouilletou © 1996</address> donne :
Marcel Fouilletou © 1996

<cite> </cite>
 
Marque une citation, un nom d'écrivain...
Pluie en Novembre, Noël en Décembre. <cite>(Marcel Fouilletou, 1889)</cite> donne :
 
Pluie en Novembre, Noël en Décembre. (Marcel Fouilletou, 1889)

 
<sup> </sup>
 
Permet d'utiliser les exposants dans des formules.
Si Albert Enstein avait dû écrire ces formules sur les pages HTML, il aurait programmé comme ça :
E=MC<sup>2</sup> donne :
 
E=MC2

 
<sub> </sub>
 
Permet d'utiliser les indices dans des formules.
De quoi satisfaire les chimistes, entre autres...
H<sub>2</sub>O donne :
 
H2O

 
<small> </small>
 
Permet de mettre les caractères en tout petit.
<small>C'est variment petit !</small> donne :
 
C'est vraiment petit !

 
<big> </big>
 
Permet de mettre les caractères en grand.
<big>C'est vraiment grand !</big> donne :
 
C'est vraiment grand !

<U> </U>
 
Permet de souligner les caractères.
<U>C'est souligné !</U> donne :
 
C'est souligné !

<strike> </strike>
 
Permet de barrer les caractères.
<strike>C'est barré !</strike> donne :
 
C'est barré !

<code> </code>
 
Utilise la police "courrier"
(idéale pour représenter des exemples de code en JavaScript , par exemple).
<code>C'est du code !</code> donne :
 
C'est du code!

 
<samp> </samp>
 
Affiche tous les caractères tels qu'ils ont été saisis.
C'est souvent pratique pour afficher ce style de signes :
 
<samp>$, £,€, #, @</samp> donne :
 

$, £,€, #, @


Marche uniquement sous Nescape

<blink> </blink>
 
Permet de faire clignoter un mot ou une phrase.
<blink>Coucou ! Beuh !</blink> donne :
 
Coucou ! Beuh !
 
Introduction | Découvrez le HTML | La page HTML | Les liens hypertextes | Formater le texte
Mettre des images | Les tableaux | Les listes & définitions | Les formulaires | Le multimédia