Bordures CSS

Les propriétés de bordure CSS vous permettent de spécifier le style, la largeur et la couleur de la bordure d’un élément.
J’ai des frontières de tous côtés.
J’ai une bordure inférieure rouge.
Style de bordure CSS
Le border-style
La propriété spécifie le type de bordure à afficher.
Les valeurs suivantes sont autorisées :
dotted
– Définit une bordure pointilléedashed
– Définit une bordure en pointilléssolid
– Définit une bordure solidedouble
– Définit une double borduregroove
– Définit une bordure rainurée 3D. L’effet dépend de la valeur border-colorridge
– Définit une bordure striée 3D. L’effet dépend de la valeur border-colorinset
– Définit une bordure d’encart 3D. L’effet dépend de la valeur border-coloroutset
– Définit une bordure de départ 3D. L’effet dépend de la valeur border-colornone
– Ne définit aucune bordurehidden
– Définit une bordure cachée
Le border-style
La propriété peut avoir de une à quatre valeurs (pour la bordure supérieure, la bordure droite, la bordure inférieure et la bordure gauche).
Exemple
Démonstration des différents styles de bordure :
p.dotted {border-style : pointillé ;}
p.dashed {border-style : dashed ;}
p.solid {style de bordure : solide ;}
p.double {style de bordure : double ;}
p.groove {border-style: groove;}
p.ridge {border-style: ridge;}
p.inset {style de bordure : encart ;}
p.outset {style de bordure : début ;}
p.none {style de bordure : aucun ;}
p.caché {border-style : caché ;}
p.mix {border-style : pointillé plein en pointillé double ;}
Résultat:
Une bordure pointillée.
Une bordure en pointillés.
Une frontière solide.
Une double bordure.
Une bordure de rainure. L’effet dépend de la valeur border-color.
Une bordure de crête. L’effet dépend de la valeur border-color.
Une bordure en médaillon. L’effet dépend de la valeur border-color.
Une frontière de départ. L’effet dépend de la valeur border-color.
Pas de frontière.
Une frontière mixte.
Essayez-le vous-même »
Note: Aucune des AUTRES propriétés de bordure CSS (sur lesquelles vous en apprendrez plus dans les chapitres suivants) n’aura AUCUN effet à moins que la
border-style
la propriété est définie !
#Bordures #CSS