Introduction au nom de couleur en HTML

Le nom de couleur en HTML joue un rôle très important dans le processus de conception Web et d'application. Il aide à changer l'apparence de notre site Web ou de notre application. De plus, cela rend notre application plus attrayante et interactive. Il existe différentes façons de définir le nom de la couleur en HTML dans le format de codage HTML. on peut utiliser des propriétés CSS supplémentaires pour l'utiliser plus efficacement. Nous pouvons utiliser le nom de couleur HTML au niveau de la page en l'incluant dans la partie du corps, nous pouvons également définir une couleur individuelle pour l'élément spécifique. Le nom de couleur en HTML est délibérément utilisé pour la couleur du texte, la couleur d'arrière-plan, la couleur de la bordure, les ombres, les dégradés et bien d'autres.

Syntaxe

  • Il existe différentes façons d'utiliser les couleurs HTML. Voyons voir un par un.
  • L'utilisation très basique de la couleur HTML consiste à l'appliquer au texte. utilisez simplement comme couleur de texte pour afficher du texte dans différentes couleurs HTML.

1. Syntaxe des couleurs du texte

color : color_name;

Voyons comment cette syntaxe fonctionnera,

Welcome to EDUBCA

Dans l'exemple ci-dessus, il affichera le texte Bienvenue à EDUBCA dans une couleur bleue comme:

  • Avec l'aide des couleurs HTML, il est également possible de les ajouter comme couleur de fond.

2. Syntaxe de la couleur d'arrière-plan

background-color:color_name;

Voyons comment cette syntaxe fonctionnera,

La catégorie contient toutes les informations de conception réparties dans de nombreuses sous-catégories du cours de conception.

  • Il est également possible d'ajouter une bordure colorée autour de n'importe quel texte ou élément en utilisant la couleur HTML en utilisant la syntaxe suivante:

3. Syntaxe des couleurs de bordure: bordure

value color_name;

Voyons comment cette syntaxe fonctionnera,

EDUCBA free certification course

Types de nom de couleur en HTML

Il existe différentes façons de définir les noms de couleur en HTML. Il est difficile de se souvenir d'un nom différent dans des couleurs différentes. Il faut donc décider de donner des valeurs à différentes couleurs. Voyons voir un par un

1. Valeur RVB

  • C'est l'une des façons de définir des noms de couleur HTML dans la combinaison de valeurs de format de couleur Rouge, Vert et Bleu. Laquelle est utilisée pour définir l'intensité des couleurs entre le nombre de 0 à 255?
  • Supposons que nous voulons définir une couleur noire en utilisant une combinaison RVB, alors elle aimera RVB (0, 0, 0). Ici, tous les paramètres de couleur seront mis à 0. Il affichera donc une couleur noire.
  • Comme un autre RVB (0, 0, 255) affichera la couleur bleue, car 255 est défini comme la valeur la plus élevée sur bleu et l'autre est 0.
  • Si nous allons à 3 valeurs égales de RVB, cela générera des nuances de couleur grise.

Exemple: RVB (0, 0, 0) pour la couleur la plus foncée où RVB (255, 255, 255) pour la couleur la plus claire.

2. Valeur HEX

  • C'est l'un des formats de nom de couleur les plus couramment utilisés en HTML dans lequel le nom de couleur sera défini au format d'une valeur hexadécimale.
  • Le format #rrggbb comprend des valeurs de RR pour le rouge, gg pour le vert et bb pour le bleu sont placées entre 00 valeur hexadécimale toff.
  • Prenons un exemple définissant la couleur # 00ff00. de sorte que ces valeurs seront générées en vert en raison du vert contenant la valeur la plus élevée (ff) où l'autre doit être réglé sur 00.

3. Valeur HSL

  • Un autre format pour définir la couleur HTML sous forme de teinte, saturation, luminosité.
  • Maintenant, nous allons voir tous les termes un par un. La teinte est définie comme le degré de couleur compris entre 0 et 360. dans lequel 0 pour le rouge, 120 pour le vert et 240 pour le bleu.
  • La saturation définit la valeur de la couleur en pourcentage, où 0% indique la nuance de gris où 100% pour la couleur complète.
  • La légèreté fonctionne également comme le pourcentage qui définit 0% pour le noir, 50% pour ni la lumière ni l'obscurité où 100% est pour le blanc.

4. Valeur RGBA

  • Ce type de couleur HTML définit l'extension pour la couleur RVB, y compris la valeur alpha. Où alpha est utilisé pour définir l'opacité de la couleur.
  • La valeur alpha se situe entre 0, 0 (entièrement transparent) à 1, 0 (pas du tout transparent)
  • L'exemple est rgba (255, 99, 71, 0)

5. Valeur HSLA

  • Cela fonctionne de la même manière que la valeur des couleurs HSL et la valeur alpha avec elle pour définir l'opacité de la couleur.
  • hsla (8, 100%, 80%, 0) pour une couleur entièrement transparente.
  • hsla (8, 100%, 80%, 0, 9) pour pas beaucoup de couleur transparente.

Exemples de nom de couleur en HTML

Voyons comment le nom de couleur en HTML est utilisé à l'aide de quelques exemples mentionnés ci-dessous:

Exemple 1

Prenons un exemple général montrant comment l'exemple de nom de couleur en HTML va être utilisé:

Code HTML:



About Life…..
Creativity Is Intelligence Having Fun



About Life…..
Creativity Is Intelligence Having Fun



About Life…..
Creativity Is Intelligence Having Fun



About Life…..
Creativity Is Intelligence Having Fun



About Life…..
Creativity Is Intelligence Having Fun

Vous apprenez plus de l'échec que du succès. Ne vous laissez pas arrêter. L'échec crée du caractère. Si vous travaillez sur quelque chose qui vous tient vraiment à cœur, vous n'avez pas besoin d'être poussé. La vision vous tire

Production:

Exemple # 2

Maintenant, nous prenons un autre exemple qui définira tous les types de couleurs HTML comme suit:

Code HTML:



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade



RGB defines Red color
RGB same values define Gray shade
New color using Hex Value
Shade of Gray
hsl color shade
rgba color shade
hsla color shade

Production:

Dans l'exemple ci-dessus, nous pouvons voir l'utilisation de différents types de couleurs HTML et comment ils sont nommés en HTML.

Exemple # 3

Une autre utilisation de la couleur HTML consiste à définir une bordure à l'élément, qui est la suivante:

Dans l'exemple, ici, nous pouvons ajouter une bordure à votre corps de code, en changeant l'arrière-plan ainsi que la couleur du texte.

Code HTML:

La théorie auto-actualisée parle de récompenses intrinsèques inhérentes à l'exécution de la tâche telles que la satisfaction au travail, le sentiment d'accomplissement, etc.

Production:

Conclusion

Nous avons découvert que les couleurs HTML sont définies avec des noms différents, une valeur en pourcentage, une valeur hexadécimale, une valeur alpha et bien d'autres. Le nom de couleur en HTML est utilisé pour faire de la couleur pour le texte, pour l'arrière-plan, pour une bordure, pour les dégradés. Il existe différents types pour définir le nom de la couleur HTML comme RGB, hex, hsl, rgba, hsla.

Articles recommandés

Ceci est un guide du nom de couleur en HTML. Nous discutons ici de l'introduction, des types de nom de couleur en HTML ainsi que des exemples, de la syntaxe et des codes HTML. Vous pouvez également consulter nos autres articles suggérés pour en savoir plus -

  1. Attribut de style HTML
  2. Balises de table HTML
  3. Lien d'image en HTML
  4. Créer des tableaux en HTML
  5. Événements HTML

Catégorie:

Outils de développement Web