16. La propiedad outline

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

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

CSS tiene las siguientes propiedades outline:

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

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;}
Scroll al inicio