propriété border-block-end CSS

Page précédente border-block-color
Page suivante border-block-end-color

Recommandation de cours :

border-block-end Définition et utilisation

CSS border-block-end Les attributs sont des abréviations des attributs suivants de CSS : border-bottom,border-left,border-right et border-top Les attributs sont très similaires, mais border-block-end Cette propriété dépend de la direction en bloc.

Remarque :les attributs CSS associés writing-mode Définit la direction en bloc. Cela affecte la position de départ et de fin du bloc ainsi que border-block-end Le résultat de l'attribut. Pour les pages en anglais, la direction en ligne va de gauche à droite, et la direction en bloc va vers le bas.

Exemple

Exemple 1

Définir la largeur, la couleur et le style de la bordure à l'extrémité de la direction en bloc :

div {
  border-block-end: 10px solid pink;
}

Essayez-le vous-même

Exemple 2 : combinaison de l'attribut writing-mode

La position de la bordure à l'extrémité de la direction en bloc est affectée par writing-mode Impact de l'attribut :

div {
  writing-mode: vertical-rl;
  border-block-end: dotted blue;
}

Essayez-le vous-même

Syntaxe CSS

border-block-end: border-block-end-width border-block-end-style border-block-end-color|initial|inherit;

Valeur de l'attribut

Valeur	Description
border-block-end-width	Spécifie l'épaisseur de la bordure à l'extrémité de la direction en bloc de l'élément. La valeur par défaut est "medium".
border-block-end-style	Spécifie le style de la bordure à l'extrémité de la direction en bloc de l'élément. La valeur par défaut est "none".
border-block-end-color	Spécifie la couleur de la bordure à l'extrémité de la direction en bloc de l'élément. La valeur par défaut est la couleur actuelle de la bordure.
initial	Réinitialise cette propriété à sa valeur par défaut. Voir : initial.
inherit	Cette propriété est héritée de l'élément parent. Voir : inherit.

Détails techniques

Valeur par défaut :	medium none currentcolor
Héritabilité :	Non
Création d'animation :	Pris en charge. Voir :Propriétés liées aux animations.
Version :	CSS3
Syntaxe JavaScript :	object.style.borderBlockEnd="pink dotted 5px"