Propriété CSS outline-offset

La propriété outline-offset spécifie l'espace entre la bordure (outline) et le bord d'un élément.

La propriété outline-offset ne fait pas une partie de la propriété raccourcie outline. Ça doit être spécifié séparément.

Valeur initiale 0
Appliquée à Tous les éléments.
Héritée Non.
Animable Oui. La largeur de l'espace est animable.
Version CSS3
Syntaxe DOM object.style.outlineOffset = "20px";

Syntaxe

outline-offset: length | initial | inherit;

Exemple

<!DOCTYPE html>
<html>
  <head>
    <title>Titre du document</title>
    <style> 
      div.ex1 {
      margin: 20px;
      border: 2px dotted #000;
      background-color: #8ebf42;
      outline: 4px solid #666;
      outline-offset: 10px;
      }  
    </style>
  </head>
  <body>
    <h2>Exemple de la propriété outline-offset</h2>
    <div class="ex1">Outline-offset est 10px</div>
  </body>
</html>

Dans l'exemple donné, l'espace entre la bordure et le bord est de 10px.

Valeurs

Valeur Description
length L'espace entre la bordure et le bord de l'élément. La valeur initiale est 0.
initial Fait utiliser la valeur initiale.
inherit Hérite la propriété de son élément parent.

Support de Navigateurs

1.0+ 15.0+ 1.5+ 1.2+ 9.5+


Trouvez-vous cela utile?

Articles Associées