Propriété de contour CSS
Exemple
Définissez un contour autour d'un élément <h2> et d'un élément <div> :
h2 {
outline: 5px dotted green;
}
div.a {
outline: 2px dashed blue;
}
Définition et utilisation
Un contour est une ligne tracée autour des éléments, à l'extérieur des bordures, pour faire ressortir l'élément.
La outline
propriété est une propriété abrégée pour :
- contour-largeur
- style contour (obligatoire)
- contour-couleur
Si contour-couleur est omis, la couleur appliquée sera la couleur du texte.
Remarque : les contours diffèrent des bordures ! Contrairement à la bordure, le contour est dessiné à l'extérieur de la bordure de l'élément et peut chevaucher d'autres contenus. De plus, le contour ne fait PAS partie des dimensions de l'élément ; la largeur et la hauteur totales de l'élément ne sont pas affectées par la largeur du contour.
Valeur par défaut: | couleur inversée moyenne |
---|---|
Hérité: | non |
Animable : | oui, voir propriétés individuelles . En savoir plus sur l'animation |
Version: | CSS2 |
Syntaxe JavaScript : | objet .style.outline="#0000FF pointillé 5px" |
Prise en charge du navigateur
Les nombres dans le tableau indiquent la première version du navigateur qui prend entièrement en charge la propriété.
Property | |||||
---|---|---|---|---|---|
outline | 1.0 | 8.0 | 1.5 | 1.2 | 7.0 |
Syntaxe CSS
outline: outline-width outline-style outline-color|initial|inherit;
Valeurs de propriété
Value | Description |
---|---|
outline-width | Specifies the width of outline |
outline-style | Specifies the style of the outline |
outline-color | Specifies the color of the outline |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |
Pages connexes
Tutoriel CSS : Plan CSS
Référence HTML DOM : propriété outline