Un contorno (outline) es una línea dibujada fuera del borde del elemento.

Outline

Un contorno es una línea que se dibuja alrededor de los elementos, FUERA de los bordes, para que el elemento «resalte».

Outline 2

CSS tiene las siguientes propiedades Outline:

  • outline-style
  • outline-color
  • outline-width
  • outline-offset
  • outline

CSS Outline Style

La propiedad outline-style puede tener los siguientes valores:

  • dotted: define un contorno punteado
  • dashed: define un contorno discontinuo
  • solid:  define un contorno sólido
  • double: define un contorno doble
  • groove: define un contorno ranurado
  • ridge: define un controno estriado
  • inset: define un contorno de inserción 3D
  • outset: define un contorno inicial 3D
  • none: define un no outline
  • hidden: define un outline oculto

Ejm

p.dotted {outline-style: dotted;}
p.dashed {outline-style: dashed;}
p.solid {outline-style: solid;}
p.double {outline-style: double;}
p.groove {outline-style: groove;}
p.ridge {outline-style: ridge;}
p.inset {outline-style: inset;}
p.outset {outline-style: outset;}