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.

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

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

Valeur initiale0
Applicabilitétous les éléments
Héritéenon
Médiavisuel, interactif
Valeur calculéecomme spécifié, mais avec les longueurs relatives converties en longueurs absolues
Type d'animationune longueur
Ordre canoniquel'ordre unique et non-ambigu défini par la grammaire formelle

Syntaxe

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.

Syntaxe formelle

<length>

Exemples

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

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

Résultat

Spécifications

Spécification Statut Commentaires
CSS Transitions
La définition de 'outline-offset' dans cette spécification.		 Version de travail outline-offset peut désormais être animée.
CSS Basic User Interface Module Level 3
La définition de 'outline-offset' dans cette spécification.		 Candidat au statut de recommandation Définition initiale.

Compatibilité des navigateurs

Fonctionnalité Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Support simple 1.0 1.5 (1.8) Pas de support 9.5 1.2
Fonctionnalité Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Support simple ? ? ? ? ?

Étiquettes et contributeurs liés au document

Étiquettes : 
 Contributeurs à cette page : SphinxKnight, mrstork, fscholz, Sebastianz, teoli, Manumanu, FredB, Kyodev, Fredchat
 Dernière mise à jour par : SphinxKnight,