outline

La propiedad CSS outline es una forma reducida para establecer una o más de las propiedades individuales de contorno outline-style, outline-width y outline-color en una sola declaración. En la mayoría de los casos el uso de este atajo es preferible y más conveniente.

Al igual que con todas las propiedades abreviadas, cualquier subvalor omitido se establecerá en su valor inicial.

Los bordes y los contornos son muy similares. Sin embargo, los contornos difieren de los bordes de la siguiente manera:

• Los contornos no ocupan espacio, son dibujados por encima del elemento. Por lo tanto, su aparición u ocultamiento no causa un redibujado de las cajas. No suma en el tamaño de la caja y no hay movimiento o desplazamiento de los elementos como con border.
• Los contornos pueden no ser rectangulares. Si el elemento se distribuye en varias líneas, el contorno no forma un rectágulo para encerrar a todo el elemento. A diferencia de los bordes, el contorno no está abierto en algunos lados:

  Ejemplo: contorno aplicado a
  varias líneas

  Ejemplo: borde aplicado a
  varias líneas

/* style */
outline: solid;

/* color | style */
outline: #f66 dashed;

/* style | width */
outline: inset thick;

/* color | style | width */
outline: green solid 3px;

/* Global values */
outline: inherit;
outline: initial;
outline: unset;

Uno, dos o tres valores, en orden arbitrario:

<outline-width>

Ver outline-width.

<outline-style>

Ver outline-style.

<outline-color>

Desde Gecko 1.9 (Firefox 3), es usado el valor de la propiedad color del elemento (color de primer plano). Ver outline-color.

[ (en-US) <'outline-color'> || (en-US) <'outline-style'> || (en-US) <'outline-width'> ] (en-US)