Propriété raccourci de la frontière CSS

Les propriétés scolarisées de CSS ont tendance à exécuter plusieurs propriétés simultanément. La propriété raccourci de la frontière CSS vous permet de changer complètement la largeur, le style et la couleur de la frontière. Cet article fournit une démonstration sur le fonctionnement de la propriété des raccourcis de frontières. De plus, divers exemples sont illustrés pour obtenir la main sur la propriété raccourci aux frontières.

Comment fonctionne la propriété raccourci des frontières

La propriété raccourci de la frontière CSS fonctionne basée sur la syntaxe suivante:

Dans la syntaxe ci-dessus,

• le sélecteur peut être n'importe quel élément, ou il peut se référer à la classe de CSS
• le largeur fait référence à la largeur de la frontière et peut être réglé en PX, EM,%. Le PX établit la norme et EM montre le résultat se référant à la valeur PX. Par exemple, si le corps a une valeur Px équivaut à 4px, il serait égal à 1EM, de même, pour 8px, ce serait 2EM.
• le style représente le style de la bordure et il peut être pointillé, pointillé, solide, double, tableau de bord, rainure, cachée, encadré,.
• le couleur La propriété ajoute de la couleur aux bordures et la couleur peut être fournie en utilisant le nom exact (rouge, bleu), en utilisant la valeur hexadécimale de la couleur, en utilisant le schéma de motif RGB / RGBA.

La discussion ci-dessus doit vous avoir aidé à obtenir le concept de propriété sténographique de la frontière CSS.

Comment utiliser la propriété sténographie des frontières CSS

Le fonctionnement fondamental de la propriété raccourci aux frontières est fourni dans la section ci-dessus. Ici, nous exercerons quelques exemples qui démontrent l'utilisation de la propriété de la frontière CSS.

Exemple 1

Le code suivant est pratiqué qui s'applique à la propriété raccourci des frontières CSS.

La description du code est fournie ci-dessous:

• Deux classes CSS sont créées nommées «One» et «Two»
• La classe «One» utilise une propriété scolareuse de bordure avec une largeur de 2px, le style est anéanti et la couleur est DarkBlue
• La classe «deux» pratique la propriété raccourci de bordure avec les valeurs suivantes: la largeur est 2px, le style est pointillé et la couleur de la bordure est rouge
• Les autres propriétés de la classe «une» et «deux» se réfèrent aux div utilisées dans le corps.
• Deux étiquettes div sont utilisées dans le corps, la première étiquette Div utilise une classe «une» de CSS et la deuxième étiquette Div utilise une classe «deux» de CSS.

L'image du code est fournie ci-dessous;

La sortie du code ci-dessus est fournie ci-dessous:

Exemple 2

La propriété raccourci à la frontière accepte trois paramètres, et leur utilisation est fournie dans l'exemple ci-dessus. Ici, nous ne considérons que le «style avec couleur» et le «style avec la largeur» de la propriété raccourci de bordure en utilisant le code suivant.

Bienvenue à Linuxhint

Bienvenue à Linuxhint

La description du code est fournie ci-dessous:

• Deux classes CSS sont créées nommées «Prim» et «SEC»
• La classe «prim» contient le style et la couleur de la propriété sténographique de la frontière
• La classe «SEC» utilise la largeur et le style
• Dans le corps, deux paragraphes sont créés qui sont associés à chaque classe CSS

L'image du code est illustrée ci-dessous:

La sortie du code ci-dessus est illustrée ci-dessous:

D'après les exemples illustrés ci-dessus, vous auriez appris la fonctionnalité de la propriété raccourci des frontières dans divers scénarios.

Conclusion

La propriété raccourci de la frontière CSS comprend trois propriétés frontalières, largeur de bordure, style frontalier et couleur de bordure. Cet article fournit un guide détaillé sur la propriété raccourci de la frontière CSS. Le fonctionnement de la propriété raccourci aux frontières s'explique brièvement où vous obtiendrez une compréhension de base de cette propriété. En outre, plusieurs exemples sont indiqués qui mettent en œuvre la propriété sténographie des frontières CSS dans divers scénarios.