Le contour CSS a expliqué
Le contour CSS contient un ensemble de propriétés pour personnaliser les couleurs, les styles, le décalage et la largeur du contour. Les propriétés de la largeur des contour, de la largeur des contours, du style et du comptoir du CSS aident à personnaliser les contour. En dehors de ceux-ci, la propriété raccourci du CSS fournit les mêmes fonctionnalités dans une syntaxe à ligne unique. Cet article fournit le guide détaillé sur les propriétés de contour CSS et servirait les résultats d'apprentissage suivants:
- le travail des propriétés de contour CSS
- Utilisation du contour CSS (avec des exemples)
Comment fonctionne le contour CSS
Les propriétés de contour CSS ont tendance à effectuer diverses personnalisations de contour. Cette section fournit la syntaxe recommandée et le fonctionnement de toutes les propriétés de contour CSS.
CSS Aperçu (style): La syntaxe fournie ci-dessous aide à modifier le style de contour.
sélecteur style de ligne: valeur;- sélecteur: Le sélecteur est un élément ou la classe CSS sur laquelle la propriété serait appliquée
- valeur: La valeur du style peut être en pointillé, en pointillé, double, solide, rainure, cachée, aucune et plus.
CSS Aperçu (largeur): La largeur du contour peut être définie en utilisant la propriété de largeur de ligne de CSS et peut être utilisée de la manière suivante.
sélecteur verse-large: valeur;valeur: Il accepte peu de valeurs prédéfinies telles que mince, moyenne et épaisse. Le poids de la ligne pour l'épaisseur est de 1px, pour le milieu est de 3px et pour l'épaisseur est de 5px (toutes ces valeurs sont approximatives). De plus, l'utilisateur peut également spécifier sa valeur en PX, EM, CM, MM.
CSS Aperçu (couleur): La couleur du contour est définie en utilisant la syntaxe.
Sélecteur Outline-Color: Value;valeur: Cette valeur de couleur peut être fournie de nombreuses manières. Le nom exact (comme le rouge, le bleu) de la couleur peut être utilisé, la valeur hexadécimale de la couleur, le motif RGB / RGBA, inversé (pour rendre le contour visible indépendamment de la couleur d'arrière-plan) et HSL.
CSS Aperçu (Offset): Habituellement, le contour commence peu de temps après la bordure, cependant, la propriété de décalage peut être utilisée pour ajouter de l'espace entre le contour et la bordure d'un élément. La syntaxe de la propriété Offset est:
Sélecteur Outline-Offset: Value;valeur: Il accepte les valeurs px, em, rem, cm, mm. Le PX est une mesure statique tandis que les mesures REM et EM sont réactives car elles dépendent de leurs valeurs de parent.
CSS décrit la propriété sténographie: La propriété CSS APESORNE RORTHAND permet d'ajouter la largeur, la couleur et le style à un aperçu de l'élément à l'aide d'un code de ligne unique. Les articles suivants se réfèrent à la propriété sténographique:
Sélecteur Outline: Value1 Value2 Value3;La valeur1, la valeur2 et la valeur 3 se rapportent à la largeur, au style et aux valeurs de couleur du contour d'un élément.
Comment utiliser le contour CSS
Cette section illustre plusieurs exemples qui présentent l'utilisation de la largeur du CSS, de la largeur, de l'alorage, du terrain, du terrain, de la propriété scolarisée.
Exemple 1: Utilisation de la largeur des contour, de style, de style, couleur contour et compensation
Cet exemple montre les propriétés de contour CSS individuellement en utilisant le code ci-dessous.
couleur rouge, largeur et décalage en px, casse-tête de style
Color-RGB, largeur et décalage en%, style style
couleur-hex, largeur et décalage dans EM, style-double
La description du code est fournie ci-dessous:
- Trois classes CSS sont créées nommées «Sty», «Stya» et «Styb». Chaque classe est définie pour utiliser les properties sombres avec diverses unités ou valeurs de mesure les prises.
- La classe «Sty» utilise le rouge comme couleur, largeur et décalage est défini en PX où le style contour est anéanti
- Le «Stya» utilise la couleur RVB, la largeur et le décalage en mm, et le style est solide
- Le «Styb» utilise la valeur hexagonale de la couleur, de la largeur et du décalage dans EM et le style est parsemé
- Les paragraphes de ce document sont stylés en «groove» avec une couleur «noire» et un fond de marge de «25px».
L'image du code est illustrée ci-dessous:
Sortir:
La sortie contient trois paragraphes, le premier utilise la classe «Sty», où les deuxième et troisième utilisent des classes «Stya» et «Styb».
Exemple 2: Utilisation de la propriété raccourci du CSS
La propriété CSS Outline Fruret vous permet de mettre en œuvre la largeur, la couleur et le style du contour en une seule ligne. Le code fourni ci-dessous pratiquait la propriété sténographique du plan:
largeur-médium, style-double, vert couleur
largeur-4px, style solide, bleu couleur
largeur mince, gêne de style
de style
largeur-médium, couleur orange
La description du code est
- Premièrement, peu de styles de paragraphe sont définis
- Initialisé cinq classes CSS nommées «Outa», «OUTB», «OUTC», «OUTD» et «OUTE» pour Outline Réthand
- Les classes «oua» et «OUTB» utilisent la propriété raccourci pour définir «largeur», «style» et «couleur» de contour
- Les classes «OUTC» et «Out» modifient deux propriétés tandis que «OUTD» personnalise le style
Sortir:
La sortie ci-dessus montre que si le style de la propriété raccourci du plan n'est pas pris en compte, vous ne pourrez pas obtenir le contour.
Conclusion
Le contour CSS permet de modifier la couleur, la largeur, le style et la valeur de décalage du contour. Cet article fournit les moyens possibles d'exercer des propriétés de contour CSS pour modifier le contour. Les propriétés de la largeur de couleurs, de la largeur des contours, du style et du comptoir du CSS aident à personnaliser le contour. De plus, le CSS décrit la propriété raccourci aide à modifier la couleur, la largeur et le style en utilisant un code de ligne unique. Pour un meilleur sous-estimation, ce message fournit le mécanisme de travail en utilisant la syntaxe. Vous obtiendrez également l'ensemble des exemples qui montrent la mise en œuvre de toutes ces propriétés individuellement et de saut-parole également.