Parfois, les auteurs de feuille de style peuvent vouloir créer des contours dynamiques autour des objets visuels comme des boutons, des entrées de formulaires, des hyperimages à zones sensibles, etc., afin de les détacher du reste du contenu. A la réception du focus, les contours pourraient réagir et créer un effet d'animation autour de l'élément concerné.
Ces contours ne prennent pas d'espace dans le document. Ils peuvent être non-rectangulaires. Les propriétés cités ci-dessous contrôlent leur largeur, leur style et leur couleur.
Cette première propriété permet de modifier la largeur du contour d'un élément. En outre, elle accepte les mêmes valeurs que la propriété border-width.
| outline-width | |
|---|---|
| Valeur | Taille thin medium thick |
| Valeur par défaut | medium |
| Domaine d'application | tous les éléments |
| Héritage | non |
| Media | visuel et interactif |
| Valeur possible |
Action | Exemple |
|---|---|---|
| medium | Une largeur moyenne a été spécifiée. | p {outline-width: medium} |
| Taille | Une largeur de 10 pixels s'appliquera au contour. | img {outline-width: 10px} |
| Windows | Macintosh | ||||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| NE4 | NE6 | NE7 | IE5 | IE55 | IE6 | OP5 | OP6 | OP7 | NE4 | NE6 | NE7 | IE4 | IE5 |