définir la couleur de la police CSS

WBOY
Libérer: 2023-05-27 14:26:09
original
794 Les gens l'ont consulté

En CSS, définir la couleur de la police est une propriété de style de base. Il est implémenté via l'attribut color. Dans cet article, nous apprendrons comment définir la couleur de la police à l'aide de la propriété color.

attribut color

L'attribut color est une propriété utilisée pour définir la couleur en CSS. Il peut être utilisé pour définir les couleurs du texte, de l’arrière-plan, des bordures et d’autres éléments.

L'attribut color peut utiliser des noms de couleurs prédéfinis, tels que rouge, vert, etc., ou vous pouvez utiliser des valeurs hexadécimales ou RVB pour spécifier les couleurs.

Voici quelques exemples d'utilisation de l'attribut color pour définir la couleur de la police :

h1 {
color: red;
}

p {
color: #0000ff;
}

span {
color: rgb(255 , 0 , 0);
}

Dans le code ci-dessus, nous avons utilisé le rouge, le bleu et le rouge RVB pour définir les couleurs des différents éléments.

Noms de couleurs prédéfinis

En CSS, certains noms de couleurs prédéfinis peuvent être utilisés directement. Voici quelques noms de couleurs couramment utilisés et leurs couleurs correspondantes :

  • rouge : rouge
  • vert : vert
  • bleu : bleu
  • noir : noir
  • blanc : blanc
  • gris : gris
  • jaune : jaune
  • violet : violet
  • orange : orange

Bien sûr, ce qui précède n'est qu'une partie de celui-ci, en plus de ceux-ci, il existe de nombreux autres noms de couleurs qui peuvent être utilisés.

Code couleur hexadécimal

En plus des noms de couleurs prédéfinis, nous pouvons également spécifier les couleurs à l'aide de codes de couleur hexadécimaux. Le code couleur hexadécimal se compose de 6 caractères, dont les deux premiers caractères représentent le rouge, les deux caractères du milieu représentent le vert et les deux derniers caractères représentent le bleu. Chaque caractère peut être un chiffre compris entre 0 et 9 ou une lettre entre A et F. Voici quelques exemples :

000000 : noir

ffffff : blanc

ff0000 : rouge

00ff00 : vert

0000ff : bleu

Valeur de couleur RVB

La valeur de couleur RVB est déterminée en spécifiant le rouge, le vert et le bleu. . Une valeur de couleur est utilisée pour définir la couleur. La plage de chaque valeur est comprise entre 0 et 255. Voici quelques exemples :

rgb(255, 0, 0) : Rouge
rgb(0, 255, 0) : Vert
rgb(0, 0, 255) : Bleu
rgb(128, 128, 128) : Gris

Définir la transparence

Grâce à l'attribut color, nous pouvons également définir la transparence de la police. La transparence est spécifiée à l'aide de l'attribut opacity et la plage de valeurs est comprise entre 0 et 1, où 0 est complètement transparent et 1 est complètement opaque. Voici un exemple :

p {
color: rgba(0, 0, 255, 0.5);
}

Dans le code ci-dessus, nous utilisons rgba() pour définir la couleur et la transparence. Parmi eux, r, g et b représentent respectivement les valeurs des trois couleurs rouge, vert et bleu, et a représente la transparence. Dans cet exemple, nous définissons la couleur sur bleu et la transparence sur 0,5, soit une transparence de 50 %.

Conclusion

Grâce à l'explication ci-dessus, nous pouvons voir qu'en CSS, définir la couleur de la police est un attribut de style très pratique. Il suffit de spécifier la couleur requise pour changer la couleur de police de l'élément. Dans le même temps, nous pouvons également contrôler la transparence de la police en définissant la transparence pour améliorer l'effet visuel de la page.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal