Attribut OUTLINE-WIDTH

Rôle

L’attribut outline-width permet de spécifier l’épaisseur du contour.

Cet attribut n’est pas obligatoire, la taille medium (épaisseur moyenne ) est la valeur par défaut

Syntaxe générale :

outline-width : 3px;

Contrairement à la bordure, vous ne pouvez pas différencier les contours haut-droite-bas-gauche. En outre, le contour n’augmente pas les dimensions du block

Version : CSS2

Héritage (inherit) : non

Propriété Javascript : element.style.outlineWidth

Testez vous-même cet attribut

Utilisez Codepen.

– Le code CSS

body{
  padding: 10px;
}
div{
  width: 230px;
  padding: 5px;
  background-color: silver;
  border: thin red solid;
  outline-width: 5px;
  outline-style: dashed;
  outline-color: orange;
}

– Le code HTML

<div>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Impedit maxime et reiciendis ullam, accusamus blanditiis iste rerum. Impedit placeat tenetur, aperiam iure dolores quibusdam repellat, alias, nesciunt, </div>

Résultat

Compatibilité

L’attribut outline-width est pris en charge par tous les principaux navigateurs
A partir d’Internet Explorer 8

Valeurs

Les différentes valeurs de l’attribut outline-width sont:

medium

Epaisseur moyenne : valeur par défaut
Syntaxe :
outline-width : medium

thin

Epaisseur mince
Syntaxe :
outline-width : thin

thick

Epaisseur importante
Syntaxe :
outline-width : thick

length

L’épaisseur du contour est définie par une valeur en px, cm, etc
Syntaxe :
outline-width : 10px

initial

Défini à sa valeur initiale (attention pas pris en charge par Internet Explorer et Opéra en dessous de la version 15). Peut être utilisé pour « neutraliser » une spécificité.
Syntaxe :
outline-width : initial

inherit

Hérite de la même propriété que l’élément parent.
Syntaxe :
outline-width : inherit

A voir aussi

border box-sizing clip height width margin padding overflow max-width min-width outline resize