Syntaxe
Une couleur en Html pur est la valeur de l'attribut d'une balise (
?)
le but sera de colorer un élément visible de la page (de la partie
<body>
donc la valeur de l'attribut
color de la balise
<font>
et des attributs de la balise
<body>
la syntaxe de la valeur d'une couleur s'exprime de 2 façons :
1°
par une combinaison de 3 codes hexadécimaux pouvant avoir chacun une valeur entre
00 (nul ou noir) et
FF (maximum) pour doser la couleur par le mélange des 3 pigments de base
rouge vert bleu précédé d'un
# pour faire comprendre au navigateur qui lit le code que c'est de l'hexadécima
symboliquement on écrira
"#RRVVBB" si on pense en Français
ou bien
"#RRGGBB" si on pense en English
mais réellement il faudra écrire le code héadécimal à 2 caractères par couleur multiplier par trois couleurs ça fait 3 paires de caractères ou 6 caractères
concrètement ça sera par exemple :
"#FF8A93"
qui donnera cette couleur
mathématiquement, en héxadécimales de
00 Ã
FF, ça fait 256 valeurs ;
comme nous avons trois couleurs, ça fait donc 256
3 = environ 16 millions de couleurs
mais 1 - l'oeil humain ne fera pas la différence entre deux couleur voisine dans les 16 millions ; 2 - si les écrans d'ordinateur peuvent en rendre encore bien plus, les navigateurs internet comme
Internet Explorer,
Mozilla et
Opera en rendent bien moins et afficheront la couleur la plus proche possible du code
le logiciel
RVB possède la fonction de réajuster une couleur pour qu'elle soit lisible par tous les navigateurs
2°
plus simple avec le nom de la couleur en anglais, les 16 couleurs de base *
(pour les navigateurs préhistoriques)
mais aussi plein d'autres couleurs qui devraient suffire et dont voici la liste (ça ne s'invente pas)
donc selon ton navigateur, tu ne les verras peu-être pas toutes.
Triées par noms :
| Nom HTML | Code RVB |
---|
| aliceblue | #F0F8FF |
| antiquewhite | #FAEBD7 |
| aqua * | #00FFFF |
| aquamarine | #7FFFD4 |
| azure | #F0FFFF |
| beige | #F5F5DC |
| bisque | #FFE4C4 |
| black * | #000000 |
| blanchedalmond | #FFEBCD |
| blue * | #0000FF |
| blueviolet | #8A2BE2 |
| brown | #A52A2A |
| burlywood | #DEB887 |
| cadetblue | #5F9EA0 |
| chartreuse | #7FFF00 |
| chocolate | #D2691E |
| coral | #FF7F50 |
| cornflowerblue | #6495ED |
| cornsilk | #FFF8DC |
| crimson | #DC143C |
| cyan | #00FFFF |
| darkblue | #00008B |
| darkcyan | #008B8B |
| darkgoldenrod | #B8860B |
| darkgray | #A9A9A9 |
| darkgreen | #006400 |
| darkkhaki | #BDB76B |
| darkmagenta | #8B008B |
| darkolivegreen | #556B2F |
| darkorange | #FF8C00 |
| darkorchid | #9932CC |
| darkred | #8B0000 |
| darksalmon | #E9967A |
| darkseagreen | #8FBC8F |
| darkslateblue | #483D8B |
| darkslategray | #2F4F4F |
| darkturquoise | #00CED1 |
| darkviolet | #9400D3 |
| deeppink | #FF1493 |
| deepskyblue | #00BFFF |
| dimgray | #696969 |
| dodgerblue | #1E90FF |
| firebrick | #B22222 |
| floralwhite | #FFFAF0 |
| forestgreen | #228B22 |
| fuchsia * | #FF00FF |
| gainsboro | #DCDCDC |
| ghostwhite | #F8F8FF |
| gold | #FFD700 |
| goldenrod | #DAA520 |
| gray * | #808080 |
| green * | #008000 |
| greenyellow | #ADFF2F |
| honeydew | #F0FFF0 |
| hotpink | #FF69B4 |
| indianred | #CD5C5C |
| indigo | #4B0082 |
| ivory | #FFFFF0 |
| khaki | #F0E68C |
| lavender | #E6E6FA |
| lavenderblush | #FFF0F5 |
| lawngreen | #7CFC00 |
| lemonchiffon | #FFFACD |
| lightblue | #ADD8E6 |
| lightcoral | #F08080 |
| lightcyan | #E0FFFF |
| lightgoldenrodyellow | #FAFAD2 |
| lightgreen | #90EE90 |
| lightgrey | #D3D3D3 |
| lightpink | #FFB6C1 |
| lightsalmon | #FFA07A |
| lightseagreen | #20B2AA |
| lightskyblue | #87CEFA |
| lightslategray | #778899 |
| lightsteelblue | #B0C4DE |
| lightyellow | #FFFFE0 |
| lime * | #00FF00 |
| limegreen | #32CD32 |
| linen | #FAF0E6 |
| magenta | #FF00FF |
| maroon * | #800000 |
| mediumaquamarine | #66CDAA |
| mediumblue | #0000CD |
| mediumorchid | #BA55D3 |
| mediumpurple | #9370DB |
| mediumseagreen | #3CB371 |
| mediumslateblue | #7B68EE |
| mediumspringgreen | #00FA9A |
| mediumturquoise | #48D1CC |
| mediumvioletred | #C71585 |
| midnightblue | #191970 |
| mintcream | #F5FFFA |
| mistyrose | #FFE4E1 |
| moccasin | #FFE4B5 |
| navajowhite | #FFDEAD |
| navy * | #000080 |
| oldlace | #FDF5E6 |
| olive * | #808000 |
| olivedrab | #6B8E23 |
| orange | #FFA500 |
| orangered | #FF4500 |
| orchid | #DA70D6 |
| palegoldenrod | #EEE8AA |
| palegreen | #98FB98 |
| paleturquoise | #AFEEEE |
| palevioletred | #DB7093 |
| papayawhip | #FFEFD5 |
| peachpuff | #FFDAB9 |
| peru | #CD853F |
| pink | #FFC0CB |
| plum | #DDA0DD |
| powderblue | #B0E0E6 |
| purple * | #800080 |
| red * | #FF0000 |
| rosybrown | #BC8F8F |
| royalblue | #4169E1 |
| saddlebrown | #8B4513 |
| salmon | #FA8072 |
| sandybrown | #F4A460 |
| seagreen | #2E8B57 |
| seashell | #FFF5EE |
| sienna | #A0522D |
| silver | #C0C0C0 |
| skyblue | #87CEEB |
| slateblue | #6A5ACD |
| slategray | #708090 |
| snow | #FFFAFA |
| springgreen | #00FF7F |
| steelblue | #4682B4 |
| tan | #D2B48C |
| teal * | #008080 |
| thistle | #D8BFD8 |
| tomato | #FF6347 |
| turquoise | #40E0D0 |
| violet | #EE82EE |
| wheat | #F5DEB3 |
| white * | #FFFFFF |
| whitesmoke | #F5F5F5 |
| yellow * | #FFFF00 |
| yellowgreen | #9ACD32 |
Trié par code :
| Nom HTML | Code RVB |
---|
| white * | #FFFFFF |
| ivory | #FFFFF0 |
| lightyellow | #FFFFE0 |
| yellow * | #FFFF00 |
| snow | #FFFAFA |
| floralwhite | #FFFAF0 |
| lemonchiffon | #FFFACD |
| cornsilk | #FFF8DC |
| seashell | #FFF5EE |
| lavenderblush | #FFF0F5 |
| papayawhip | #FFEFD5 |
| blanchedalmond | #FFEBCD |
| mistyrose | #FFE4E1 |
| bisque | #FFE4C4 |
| moccasin | #FFE4B5 |
| navajowhite | #FFDEAD |
| peachpuff | #FFDAB9 |
| gold | #FFD700 |
| pink | #FFC0CB |
| lightpink | #FFB6C1 |
| orange | #FFA500 |
| lightsalmon | #FFA07A |
| darkorange | #FF8C00 |
| coral | #FF7F50 |
| hotpink | #FF69B4 |
| tomato | #FF6347 |
| orangered | #FF4500 |
| deeppink | #FF1493 |
| magenta | #FF00FF |
| fuchsia * | #FF00FF |
| red * | #FF0000 |
| oldlace | #FDF5E6 |
| lightgoldenrodyellow | #FAFAD2 |
| linen | #FAF0E6 |
| antiquewhite | #FAEBD7 |
| salmon | #FA8072 |
| ghostwhite | #F8F8FF |
| mintcream | #F5FFFA |
| whitesmoke | #F5F5F5 |
| beige | #F5F5DC |
| wheat | #F5DEB3 |
| sandybrown | #F4A460 |
| azure | #F0FFFF |
| honeydew | #F0FFF0 |
| aliceblue | #F0F8FF |
| khaki | #F0E68C |
| lightcoral | #F08080 |
| palegoldenrod | #EEE8AA |
| violet | #EE82EE |
| darksalmon | #E9967A |
| lavender | #E6E6FA |
| lightcyan | #E0FFFF |
| burlywood | #DEB887 |
| plum | #DDA0DD |
| gainsboro | #DCDCDC |
| crimson | #DC143C |
| palevioletred | #DB7093 |
| goldenrod | #DAA520 |
| orchid | #DA70D6 |
| thistle | #D8BFD8 |
| lightgrey | #D3D3D3 |
| tan | #D2B48C |
| chocolate | #D2691E |
| peru | #CD853F |
| indianred | #CD5C5C |
| mediumvioletred | #C71585 |
| silver | #C0C0C0 |
| darkkhaki | #BDB76B |
| rosybrown | #BC8F8F |
| mediumorchid | #BA55D3 |
| darkgoldenrod | #B8860B |
| firebrick | #B22222 |
| powderblue | #B0E0E6 |
| lightsteelblue | #B0C4DE |
| paleturquoise | #AFEEEE |
| greenyellow | #ADFF2F |
| lightblue | #ADD8E6 |
| darkgray | #A9A9A9 |
| brown | #A52A2A |
| sienna | #A0522D |
| yellowgreen | #9ACD32 |
| darkorchid | #9932CC |
| palegreen | #98FB98 |
| darkviolet | #9400D3 |
| mediumpurple | #9370DB |
| lightgreen | #90EE90 |
| darkseagreen | #8FBC8F |
| saddlebrown | #8B4513 |
| darkmagenta | #8B008B |
| darkred | #8B0000 |
| blueviolet | #8A2BE2 |
| lightskyblue | #87CEFA |
| skyblue | #87CEEB |
| gray * | #808080 |
| olive * | #808000 |
| purple * | #800080 |
| maroon * | #800000 |
| aquamarine | #7FFFD4 |
| chartreuse | #7FFF00 |
| lawngreen | #7CFC00 |
| mediumslateblue | #7B68EE |
| lightslategray | #778899 |
| slategray | #708090 |
| olivedrab | #6B8E23 |
| slateblue | #6A5ACD |
| dimgray | #696969 |
| mediumaquamarine | #66CDAA |
| cornflowerblue | #6495ED |
| cadetblue | #5F9EA0 |
| darkolivegreen | #556B2F |
| indigo | #4B0082 |
| mediumturquoise | #48D1CC |
| darkslateblue | #483D8B |
| steelblue | #4682B4 |
| royalblue | #4169E1 |
| turquoise | #40E0D0 |
| mediumseagreen | #3CB371 |
| limegreen | #32CD32 |
| darkslategray | #2F4F4F |
| seagreen | #2E8B57 |
| forestgreen | #228B22 |
| lightseagreen | #20B2AA |
| dodgerblue | #1E90FF |
| midnightblue | #191970 |
| aqua * | #00FFFF |
| cyan | #00FFFF |
| springgreen | #00FF7F |
| lime * | #00FF00 |
| mediumspringgreen | #00FA9A |
| darkturquoise | #00CED1 |
| deepskyblue | #00BFFF |
| darkcyan | #008B8B |
| teal * | #008080 |
| green * | #008000 |
| darkgreen | #006400 |
| blue * | #0000FF |
| mediumblue | #0000CD |
| darkblue | #00008B |
| navy * | #000080 |
| black * | #000000 |
Une page qui a disparu, mais pas le site sur les couleur :
www.pourpre.com
sur lequel j'avais pompé le code avant de retravailler le tableau, donc un grand merci au webmestre de www.pourpre.com
Astuce
Il n'existe pas en Html de couleur transparente ou translucide, c'est un effet qui est possible seulement avec une image *.gif dont une couleur visible habituellement, sera rendu invisible donc transparente.
C'est maintenant très simple de faire une image avec des parties transparente avec le logiciel The Gimp qui fonctionne avec des calques qui peuvent être transparents, sans couleur de fond, au moment de la sauvegarde de l'image en format GIF ou PNG, l'image sera aplatie et toutes les partie du calque non coloriées seront automatiquement transparentes, voir
ce tutoriel.