Propriété de couleur frontalière en CSS
La propriété Border-Color accepte les couleurs en plusieurs tendances telles que le nom exact des couleurs, une représentation hexadécimale de la couleur et les représentations RGB / RGBA.
Cet article fournit les moyens possibles de définir la propriété de couleur bordure d'un élément HTML.
Comment fonctionne la propriété des couleurs frontalières dans CSS
Un élément est entouré de quatre bordures, en haut, en bas, en bas et en supérieur. La propriété de couleur frontière de CSS suit la syntaxe fournie ci-dessous:
Border-Color: valeur;Le mot-clé de couleur bordure reste le même alors que la valeur dépend de l'exigence de l'utilisateur et qu'il peut être le nom de couleur exact, la valeur hexadécimale de la couleur ou la combinaison RGB / RGBA.
Comment utiliser la propriété de couleur frontalière dans CSS
Cette section comprend plusieurs scénarios pour appliquer une propriété de couleur frontalière dans CSS.
Exemple 1: Utilisation de la combinaison RVB
En informatique, le RVB (rouge vert rouge) est la norme largement utilisée lors de la gestion des couleurs. La valeur de R, G et B varie de 0 à 255 et chaque combinaison de valeurs renvoie une couleur différente.
Par exemple, le code HTML suivant pratique la classe CSS interne pour définir la couleur de la bordure.
Bienvenue à Linuxhint
L'image du code ci-dessus est fournie ci-dessous:
Sortir:
Exemple 2: Utilisation de la combinaison RGBA
Le RGBA (rouge, vert, bleu, alpha) est une extension de RGB, et l'alpha représente la transparence de la couleur. La valeur alpha varie de 0.0 à 1.0 (0.0 est le moins transparent et 1.0 est le plus transparent). Le code fourni ci-dessous pratique le CSS interne pour appliquer RGBA:
Bienvenue à Linuxhint
Une classe CSS est créée nommée «Bor-Color» qui contient la propriété des couleurs de la bordure. Cette classe est ensuite utilisée dans l'élément de paragraphe du corps.
Sortir:
Exemple 3: Utilisation du nom d'une couleur
Le nom de couleur exact peut être utilisé pour spécifier la couleur de la bordure comme illustré dans le code suivant
Bienvenue à Linuxhint
Le code HTML ci-dessus contient,
- Une balise de style pour ajouter une classe CSS nommée «Bor-Col» pour définir la couleur de la bordure
- et un paragraphe est créé qui est associé à la classe CSS
Sortir:
Exemple 4: Utilisation de la valeur hexagonale de la couleur
La valeur hexadécimale d'une couleur peut également être utilisée pour la couleur de la bordure. Le code suivant pratique le code hexadécimal de couleur noire pour l'utiliser pour la couleur de la bordure:
Bienvenue à Linuxhint
Une classe CSS est définie dans le code ci-dessus pour définir la couleur de la bordure au format hexadécimal et un paragraphe est créé pour utiliser cette classe CSS.
Sortir:
Exemple 5: Utilisation de la propriété de couleur frontière sur les bordures individuelles
La propriété de couleur frontalière est subdivisée en couleur frontalière, couleur frontière, couleur, couleur bordure et bordure-gauche pour colorer les côtés de la frontière. Le code suivant est pratiqué pour donner des couleurs aux côtés de la bordure individuellement.
Le côté supérieur de la bordure est coloré
Le côté droit de la bordure est coloré
Le côté inférieur de la bordure est coloré
Le côté gauche de la bordure est coloré
Dans le code ci-dessus,
- Quatre classes CSS sont créées nommées «top», «droite», «fond» et «gauche» qui sont utilisées pour appliquer «Border-Top-Color», «Border-Right-Color», «Border-Bottom-Color », Et« Border-Left-Color ».
- Les frontières du paragraphe sont solides
- Quatre paragraphes sont créés et contient chacun une classe CSS
Sortir:
Conclusion
La propriété de couleur frontière du CSS permet des changements dans la couleur de la bordure en fonction des exigences. Ce message descriptif fournit la démonstration de l'utilisation de la propriété de couleur bordure dans CSS pour modifier la couleur de la bordure. Il existe de nombreuses façons de le faire, la propriété de couleur bordure accepte les couleurs dans plusieurs tendances telles que le nom exact de la couleur, une représentation hexadécimale de la couleur et les représentations RGB / RGBA. À la fin, vous auriez appris l'application des biens de couleur frontalière dans CSS en explorant plusieurs scénarios énoncés dans ce guide.