in

Propiedades de esquema CSS


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


Este elemento tiene un borde negro y un contorno verde con un ancho de 10px.

Inténtalo tú mismo »


Esquema CSS

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

CSS tiene las siguientes propiedades de esquema:

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

Nota: ¡El contorno difiere de las fronteras! A diferencia del borde, el contorno se dibuja fuera del borde del elemento y puede superponerse a otro contenido. Además, el contorno NO es parte de las dimensiones del elemento; el ancho y la altura totales del elemento no se ven afectados por el ancho del contorno.


Estilo de esquema CSS

los outline-style La propiedad especifica el estilo del contorno y puede tener uno de los siguientes valores:

  • dotted – Define un contorno punteado
  • dashed – Define un contorno punteado
  • solid – Define un contorno sólido
  • double – Define un doble contorno
  • groove – Define un contorno acanalado en 3D
  • ridge – Define un contorno estriado en 3D
  • inset – Define un contorno de inserción 3D
  • outset – Define un esquema inicial 3D
  • none – No define ningún contorno
  • hidden – Define un contorno oculto

El siguiente ejemplo muestra los diferentes outline-style valores:

Ejemplo

Demostración de los diferentes estilos de contorno:

p.dotted {estilo de esquema: punteado;}
p.dashed {estilo de esquema: discontinuo;}
p.solid {estilo de contorno: sólido;}
p.double {estilo de esquema: doble;}
p.groove {estilo de contorno: groove;}
p.ridge {estilo de contorno: cresta;}
p.inset {estilo de esquema: recuadro;}
p.outset {estilo de esquema: comienzo;}

Resultado:

Un contorno punteado.

Un contorno punteado.

Un contorno sólido.

Un doble contorno.

Un esquema de surco. El efecto depende del valor del color del contorno.

Un contorno de cresta. El efecto depende del valor del color del contorno.

Un esquema insertado. El efecto depende del valor del color del contorno.

Un esbozo inicial. El efecto depende del valor del color del contorno.

Inténtalo tú mismo »

Nota: Ninguna de las otras propiedades del esquema (sobre las que aprenderá más en los siguientes capítulos) tendrá NINGÚN efecto a menos que
outline-style ¡La propiedad está configurada!

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Creación de informes de formato libre en Smart View mediante el uso de fuentes de datos de Essbase

cloud computing interview questions

Las 37 preguntas principales de la entrevista sobre computación en la nube (2021)