Atributo outline de CSS

Definición y uso

La línea del contorno (outline) es una línea dibujada alrededor del elemento, ubicada en el exterior del borde, que puede resaltar el elemento.

Notas:La línea del contorno no ocupa espacio y no tiene por qué ser rectangular.

La propiedad abreviada outline establece todas las propiedades de contorno en una declaración.

Se pueden establecer los siguientes atributos en orden:

Si no se establece algún valor, no habrá problemas, por ejemplo, outline:solid #ff0000; también está permitido.

Vea también:

Tutoriales de CSS:Contorno de CSS

Manual de referencia de HTML DOM:Propiedad outline

Ejemplo

Establecer el estilo de los 4 bordes:

p
  {
  outline:#00FF00 dotted thick;
  }

Prueba tú mismo

Sintaxis de CSS

outline: outline-width outline-style outline-color|initial|inherit;

Valor del atributo

Valor Descripción
outline-color Define el color del borde. Ver:outline-color posibles valores.
outline-style Define el estilo del borde. Ver:outline-style posibles valores.
outline-width Define el ancho del borde. Ver:outline-width posibles valores.
inherit Se debe heredar la configuración de la propiedad outline del elemento padre.

Detalles técnicos

Valor predeterminado: invert none medium
Herencia: no
Versión: CSS2
Sintaxis de JavaScript: object.style.outline="#0000FF dotted thin"

Ejemplo TIY

Dibujar una línea alrededor del elemento
Este ejemplo muestra cómo usar la propiedad outline para dibujar una línea alrededor del elemento.

Compatibilidad del navegador

Los números en la tabla indican la versión del navegador que admite completamente la propiedad.

Chrome IE / Edge Firefox Safari Opera
1.0 8.0 1.5 1.2 7.0

Notas:Si se especifica !DOCTYPE, IE8 admite la propiedad outline.