Propiedad outline

La propiedad outline establece el color, tipo y grosor para el contorno exterior (borde que no ocupa espacio) para todos los lados simultáneamente, pero a diferencia de border dicho borde no expande el elemento. Es una propiedad abreviada para outline-width, outline-style y outline-color (pero no para outline-offset).

Sintaxis

cssselector {
  outline: grosor tipo color;
}

El orden de las propiedades no importa.

Ejemplo . Solo outline

html<div id="elem"></div>

css#elem {
  outline: 1px solid black;
  width: 300px;
  height: 100px;
}

Результат:

Ejemplo . Propiedades outline y border juntas

El borde de outline estará en el exterior, y el borde de border en el interior:

html<div id="elem"></div>

css#elem {
  outline: 4px solid green;
  border: 4px solid red;
  width: 300px;
  height: 100px;
}

Результат:

Véase también