Quoi ? Votre page est grise ? Il manque des couleurs ? Je vais vous en donner des couleurs ! Et par tous les moyens ! Texte, liens, fond...
Voyez vous-même.
Comment appeller une couleur ?
C'est une question très importante car on a plusieurs choix. On peut donner une couleur en :
La première méthode est la plus pratique, mais elle offre moins de choix. Inversement pour la deuxième méthode, elle est moins pratique mais offre énormément de choix (256 X 256 X 256 couleurs, si vous voulez savoir.)
Voici les couleurs en anglais reconnues par la plupart des navigateurs :
| Couleur | Aperçu |
|---|---|
| Black | |||||||||||||||||||||||||||||||||||||||||||| |
| Silver | |||||||||||||||||||||||||||||||||||||||||||| |
| Gray | |||||||||||||||||||||||||||||||||||||||||||| |
| White | |||||||||||||||||||||||||||||||||||||||||||| |
| Maroon | |||||||||||||||||||||||||||||||||||||||||||| |
| Red | |||||||||||||||||||||||||||||||||||||||||||| |
| Purple | |||||||||||||||||||||||||||||||||||||||||||| |
| Fuchsia | |||||||||||||||||||||||||||||||||||||||||||| |
| Green | |||||||||||||||||||||||||||||||||||||||||||| |
| Lime | |||||||||||||||||||||||||||||||||||||||||||| |
| Olive | |||||||||||||||||||||||||||||||||||||||||||| |
| Yellow | |||||||||||||||||||||||||||||||||||||||||||| |
| Navy | |||||||||||||||||||||||||||||||||||||||||||| |
| Blue | |||||||||||||||||||||||||||||||||||||||||||| |
| Teal | |||||||||||||||||||||||||||||||||||||||||||| |
| Aqua | |||||||||||||||||||||||||||||||||||||||||||| |
Pour indiquer une couleur avec les valeurs rouge-vert-bleu, on doit suivre le schéma ci-dessous :
#XXXXXXAprès le #, on donne les valeurs hexadécimales (les X) de la couleur.
En hexadéciaml, 0=0, comme d'habitude, 1=1, 2=2, 3=3... 9=9, mais à 10 on met des lettres. Donc 10=A, 11=B, 12=C, 13=D, et ce jusqu'à 15 (F).
Deux X valent une couleur. Par exemple :
#4D708FVeut dire qu'il y a 4 et 13 de rouge, 7 et 0 de vert, 8 et 15 de bleu.
Pour colorer le texte, on reprend le tag <font> et on lui ajoute le nouveau tag color. Après, vous indiquez la couleur comme décrit plus haut.
<font color="#1ADE15">Jolie couleur !</font><br> <font color="maroon" size="9">Marron !</font>Rien de plus simple, maintenant que vous savez écrire les couleurs !!!
Pour définir une couleur qui sera utilisée sur toute la page, on doit ajouter un attribut au tag <body> (eh oui ! y'en a !) : text. Exemple :
<body text="navy"> Bla bla bla... </body>
La couleur des liens doit être définie avec un attribut du tag <body> : link.
<body text="navy" link="#0FFF59"> <a href="page.html">Cliquez ici !</a> </body>De même, il existe les attributs vlink et alink. vlink donne la couleur des liens visités et alink la couleur des liens activés.
<body text="navy" link="#0FFF59" alink="blue" vlink="red"> Re-bla bla bla. </body>
Choisissez bien votre couleur de fond, parce qu'en général, c'est jamais super. Le mieux c'est d'utiliser une image de fond. Mais si vous le voulez, utilisez l'attribut bgcolor du tag <body>.
<body bgcolor="#2749E0"> </body>
Voici maintenant un exemple qui récapitule tout ce que vous venez de voir.
J'y ai ajouté en plus d'autres tags que vous avez vu, et que vous devriez reconnaître. C'est une page... haute en couleurs !
<html> <head> <title>Rien que des couleurs !</title> <meta name="keywords" content="couleurs, flashs, vif, jaune, vert, rouge, bleu"> <meta name="description" content="Une page très colorée !"> <meta name="generator" content="Bloc-notes"> <meta name="author" content="Mathieu Nebra"> </head> <body text="green" link="maroon" alink="#14D5FA" vlink="red" bgcolor="yellow"> <basefont size="4"> <div align="center"><h1><font color="red">FLASH !!! </font></h1></div> <p><br>Bienvenue sur la page de Mister color ! Régalez vos <b>yeux</b> ! <p><br> <a href="../couleur.html">Partir !!!!</a> </body> </html>
Au moins, on ne se plaindra pas d'une certaine monotonie de votre page !
Maintenant nous allons apprendre à insérer des images dans votre page html, et vous vous demanderez ce que l'on serait sans images !