propriété border-block-start-color CSS

Définition et utilisation

border-block-start-color Définir la couleur de la bordure à l'origine de la direction en bloc de l'élément.

Remarque :Pour que border-block-start-color Pour que l'attribut fonctionne, il est nécessaire de définir border-block-start-style attributs.

CSS border-block-start-color Les attributs sont similaires aux attributs border-bottom-color,border-left-color,border-right-color et border-top-color Très similaire, mais border-block-start-color L'attribut 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ébut et de fin du bloc, ainsi que border-block-start-color Résultat de l'attribut. Pour les pages en anglais, la direction en ligne est de gauche à droite, et la direction en bloc est vers le bas.

Exemple

Exemple 1

Définir la couleur de la bordure au début de la direction en bloc :

div {
  border-block-start-style: solid;
  border-block-start-color: pink;
}

Essayez-le vous-même

Exemple 2 : combinaison de l'attribut writing-mode

La position de la couleur de la bordure au début de la direction en bloc est déterminée par writing-mode Impact de l'attribut :

div {
  border-block-start-style: solid;
  writing-mode: vertical-rl;
  border-block-start-color: blue;
}

Essayez-le vous-même

Syntaxe CSS

border-block-start-color: color|transparent|initial|inherit;

Valeur de l'attribut

Valeur Description
color La couleur de la bordure doit être spécifiée. Par défaut, c'est la couleur actuelle de l'élément. See :Valeurs de couleur CSS.
transparent La couleur de la bordure doit être transparente.
initial Set this property to its default value. See initial.
inherit Inherits this property from its parent element. See inherit.

Détails techniques

Valeur par défaut : La couleur actuelle de l'élément
Héritabilité : Non
Création d'animation : Prise en charge. Voir :Propriétés liées aux animations.
Version : CSS3
Syntaxe JavaScript : object.style.borderBlockStartColor="pink"

Prise en charge du navigateur

Les nombres dans le tableau représentent la version du navigateur qui prend en charge cette propriété pour la première fois.

Chrome Edge Firefox Safari Opera
69.0 79.0 41.0 12.1 56.0

Pages associées

Tutoriel :Bordure CSS

Référence :propriété border CSS

Référence :propriété border-block CSS

Référence :propriété border-block-color CSS

Référence :propriété border-block-end-color CSS

Référence :propriété border-block-start-style CSS

Référence :propriété border-bottom-color CSS

Référence :Attribut border-left-color CSS

Référence :Attribut border-right-color CSS

Référence :Attribut border-top-color CSS

Référence :Attribut writing-mode CSS