2 min de lectura

Anchura

El ancho del borde se puede definir uno por uno.

border-top-widthborder-right-width

border-bottom-width

border-left-width

Anchura del borde superior

Anchura del borde derecho

Anchura del borde inferior

Anchura del borde izquierdo

Valores ( <medida> | thin | medium | thick ) | inherit
Se aplica a Todos los elementos
Valor inicial Medium
Descripción Establece la anchura de cada uno de los cuatro bordes de los elementos

Pero también puede ser definido por medio de los shorthand ya mencionados anteriormente en función del orden de las manecillas del reloj.

Color

El ancho del borde se puede definir uno por uno al igual que la anchura

border-top-colorborder-right-color

border-bottom-color

border-left-color

Color del borde superior

Color del borde derecho

Color del borde inferior

Color del borde izquierdo

Valores <color> | transparent | inherit
Se aplica a Todos los elementos
Valor inicial
Descripción Establece el color de cada uno de los cuatro bordes de los elementos

Pero también puede ser definido por medio de los shorthand ya mencionados anteriormente en función del orden de las manecillas del reloj.

Estilo

El estilo del borde se puede definir uno por uno al igual que la anchura y el color.

border-top-styleborder-right-style

border-bottom-style

border-left-style

Estilo del borde superior

Estilo del borde derecho

Estilo del borde inferior

Estilo del borde izquierdo

Valores none | hidden | dotted | dashed | solid | double | groove | ridge | inset | outset | inherit
Se aplica a Todos los elementos
Valor inicial none
Descripción Establece el estilo de cada uno de los cuatro bordes de los elementos

Los estilos permitidos son los siguientes:

Los bordes también pueden ser definidos por medio de los shorthand ya mencionados anteriormente en función del orden de las manecillas del reloj.

Shorthand para border

Sin embargo existe para los bordes un shorthand aún mas reducido que nos permite utilizar todas las caracteristicas de los bordes en una misma línea:

Siempre en ese orden (medida, estilo y color).

Y se puede simplificar aún mas con el shorthand global para bordes.

Compartir
Licenciada en Informática con Maestría en Tecnologías de la Información. Docente por convicción con trece años de experiencia, desarrolladora desde hace nueve años trabajando actualmente con desarrollo WEB para alta disponibilidad, además de ser consultor independiente y capacitador. Participe del movimiento del software libre como fiel apasionada, reconocida por su actividad en la comunidad y su participación en la inclusión.

DEJA UNA RESPUESTA

Please enter your comment!
Please enter your name here