outline
Sumário
A propriedade CSS outline
é uma propriedade abreviada para configurar uma ou mais das propriedades de contorno outline-style
(en-US), outline-width
(en-US) e outline-color
(en-US) em uma única declaração. Na maioria dos casos o uso abreviado é preferível e mais conveniente.
Contornos se diferenciam de bordas das seguintes maneiras:
- Contornos não ocupam espaços, eles são desenhados acima do conteúdo.
- Contornos podem não ser retangulares. Eles são retangulares no Gecko/Firefox. Mas por exemplo, Opera desenha uma forma não retangular em torno de uma construção como este: TEXTTEXTTEXT
Initial value | as each of the properties of the shorthand:
|
---|---|
Aplica-se a | all elements |
Inherited | não |
Computed value | as each of the properties of the shorthand:
|
Animation type | as each of the properties of the shorthand:
|
Sintaxe
css
/* largura | estilo | cor */
outline: 1px solid white;
/* Valores globais */
outline: inherit;
outline: initial;
outline: unset;
Valores
Um, dois ou três valores, dada em ordem arbitrária:
<'outline-width'>
-
Veja
outline-width
(en-US). <'outline-style'>
-
Veja
outline-style
(en-US). <'outline-color'>
-
Desde Gecko 1.9 (Firefox 3), o valor da propriedade
color
(cor de primeiro plano) é usado. Vejaoutline-color
(en-US).
Sintaxe completa
outline =
<'outline-color'> || (en-US)
<'outline-style'> || (en-US)
<'outline-width'>
Exemplos
css
/* duas declarações identicas */
:link:hover {
outline: 1px solid #000;
}
:link:hover {
outline: solid black 1px;
}
Especificações
Specification |
---|
CSS Basic User Interface Module Level 4 # outline |
Compatibilidade com navegadores
BCD tables only load in the browser