• Tableaux à angles arrondis
• Créer une barre de scroll colorée
• Les Roll-Over
• Créer un calque
• Créer un tableau
• Créer un calque
• Créer un tableau
• Créer un calque
• Créer un tableau
• Créer un calque
• Créer un poulet
• Créer un calque
• Créer un tableau
• Créer un formu



• Monter une page
• Déplacer une image
• Manipuler un calque






Pages précédentesRetour au sommairePages suivantes
  Les polices de caractères / Formater du texte
  Les lignes de séparation
  Exercice pratique

 1. Les polices de caractère 

Il n'y a rien de plus facile à spécifier une police, la méthode à utiliser par le HTML s'appuie sur la balise <FONT>.

Cependant, afin que votre document se visualise correctement, ( avec la police définie dans votre document ), essayer d'employer une police standard ( Arial, Verdana, Courrier...) à toutes les plates-formes, sinon la police paramétrée par défaut sur le navigateur de chaque visiteur sera affichée.

La balise <FONT> possède plusieurs attributs :
  •  FACE : Permet de définir par ordre de priorité, les noms des polices.

    Par contre, un ordinateur ne peut lire une police que s'il la possède ! Si ce n'est pas le cas, la police élaborée sera remplacée par la police par défaut de l'ordinateur.
    Essayer de mentionner au moins deux noms de police dans l'attribut FACE afin d'augmenter vos chances et ne choisissez pas des polices "exotiques" car le résultat recherché ne sera pas visible chez le poste client.

    Exemple : <FONT FACE="arial,helvetica" SIZE="3" COLOR="black">

    La
  • police helvetica est l'équivalent de l'Arial pour les Mac; vous pouvez également choisir Verdana qui est très répandue sur le web.

    Je vous conseille cependant de ne pas abuser quant au choix multiple qui s'offre à vous pour le type de police.
    Pour que l'allure d'un site web soit cohérente, je vous conseille d'utiliser les mêmes polices et les mêmes couleurs dans l'ensemble de vos pages.


  •  SIZE : Permet de préciser la taille de la police de 1 à 7.

    La valeur par défaut est égale à 3.
    A noter qu'il peut être utilisé de deux manières :
    Absolue - Exemple : size=2
    Relative - Exemple : size=+2 ( par rapport à la taille par défaut ).


  •  COLOR : Permet de définir la couleur du texte ( soit avec le nom de la couleur ou la valeur hexadécimale correspondante ).
    Nous aborderons plus en détail les couleurs quant à leurs noms et leurs codes héxadécimaux dans le chapitre consacré aux couleurs..
 
Top
 
Voici quelques exemples d'utilisation pour la balise <FONT> :

<FONT FACE="arial,helvetica" SIZE="4" COLOR="blue">Police Arial, Helvetica de taille 4 et de couleur bleu ciel.</FONT>

Voici le résultat : Police Arial, Helvetica de taille 4 et de couleur bleu ciel.

<FONT FACE="verdana,helvetica" SIZE="2" COLOR="red">Et voici une police Verdana de taille 2 et en rouge!!

Voici le résultat : Et voici une police Verdana de taille 2 et en rouge!!


 2. Les lignes de séparation 

Comment insérer des lignes de séparation ?

La balise est <HR>. Cette balise ne se ferme pas comme pour la balise <BR>.

On peut préciser la largeur de la ligne avec l'attribut width, exprimé soit en %age, soit en nombre de pixels.

<HR WIDTH=50%> signifie que la ligne occupera 50% de la largeur de la fenêtre.




Par contre, si j'écris , <HR WIDTH=50 ALIGN="LEFT">, le résultat est différent.




On peut également quantifier l'épaisseur de la ligne à l'aide de l'attribut SIZE :

<HR WIDTH="75%" SIZE="6" ALIGN="CENTER">




Par défaut, les navigateurs les plus courants montrent des lignes de séparation en 3D ( avec ombre ); il est possible de les éviter par l'ajout de l'attribut NOSHADE :




Enfin, on peut ajouter une couleur mais cette fonctionnalité n'est autorisée que sur Internet Explorer; cela ne fonctionne pas sur Netscape ( comme beaucoup d'autres fonctionnalités ) :-(

Si comme moi, vous utilisez Explorer, vous verrez ce que cela donne, pour les autres, dépêchez-vous de télécharger Microsoft Internet Explorer 5.5 en cliquant ici.


 
Top
 

 3. Exercice pratique 

Le but de cette exercice est de revoir toutes les balises que nous avons abordés jusque là .

Cliquez sur le bouton pour voir le but à atteindre

Exercice pratique


Ouvrez un nouveau document.html et saisissez le code HTML correspondant.

A vous de jouer maintenant !!
 
Pages précédentesRetour au sommairePages suivantes
Recherche par
mots-clés :

• Les feuilles de style
• Les popups
• Des liens spéciaux





• Test HTML
• Test DHTML
• Test Javascript





• Scripts dhtml