CSS

HTML

COMPONENTS

CODE HUB

Generador de Borde CSS

Configuración

Ancho del Borde: 5px

Tipo

Color del Borde

#000000

Clase

Vista previa

Código

border: 5px solid #000000;

ReadyTools Academy

Lerne HTML, CSS und JavaScript kostenlos mit der ReadyTools Academy.

Verfolge deinen Fortschritt, lerne in deinem eigenen Tempo und habe Spaß dabei! 🎯

Comenzar

Generador de Borde CSS

En CSS, puedes aplicar bordes a los elementos HTML utilizando la propiedad border o sus sub-propiedades individuales. Los bordes se utilizan para crear límites visuales alrededor de los elementos, como divs, párrafos o imágenes.

La propiedad border permite establecer múltiples propiedades de borde en una sola declaración. Consiste en tres partes principales:

  • border-width Especifica el ancho del borde.
  • border-style Especifica el estilo del borde (por ejemplo, sólido, discontinuo, punteado).
  • border-color Especifica el color del borde.

Aquí tienes un ejemplo de cómo puedes usar la propiedad border para crear un borde negro sólido alrededor de un elemento:

.border-element { border: 2px solid #000000; }

en este ejemplo:

  • La clase .border-element aplica un borde sólido negro de 2 píxeles al elemento.

También puedes especificar propiedades de borde individuales por separado si deseas un mayor control sobre cada aspecto del borde:

.border-individual-element { border-width: 3px; border-style: dashed; border-color: #FF0000; }

En este caso:

  • La clase .border-individual-element establece un borde rojo discontinuo de 3 píxeles alrededor del elemento.

Puedes personalizar la propiedad border y sus sub-propiedades individuales para crear varios estilos, anchos y colores de borde para tus elementos HTML, lo que te permite lograr los efectos visuales deseados y la estética del diseño.