outline-offset

La propriété outline-offset définit l'espace qu'il y a entre la bordure dessinée par outline et le bord de la boîte de bordure d'un élément. Cet espace est transparent et la couleur visible en arrière-plan sera déterminée par l'élément parent.

Exemple interactif

Syntaxe

css

/* Valeurs de longueur */
/* Type <length>       */
outline-offset: 3px;
outline-offset: 0.2em;

/* Valeurs globales */
outline-offset: inherit;
outline-offset: initial;
outline-offset: unset;

Valeurs

<length>

La largeur de l'espace, voir la page <length> pour plus d'informations. Les valeurs négatives sont utilisées et font que la bordure dessinée est dessinée dans l'élément.

Définition formelle

Valeur initiale0
Applicabilitétous les éléments
Héritéenon
Valeur calculéecomme spécifié, mais avec les longueurs relatives converties en longueurs absolues
Type d'animationune longueur

Syntaxe formelle

outline-offset = 
  <length>

Exemples

CSS

css

.exemple {
  outline: 1px dashed red;
  /* On décale la ligne de 10px */
  outline-offset: 10px;
  background: yellow;
  margin: 15px;
  border: 1px solid black;
}

HTML

html

<p class="exemple">La bordure est décalée</p>

Résultat

Spécifications

Specification
CSS Basic User Interface Module Level 4
# outline-offset

Compatibilité des navigateurs

BCD tables only load in the browser