Borde redondeado de CSS

Borde redondeado de CSS

border-radius La propiedad se utiliza para agregar bordes redondeados a los elementos:

Bordes normales

Bordes redondeados

Bordes redondeados

Bordes redondeados

Ejemplo

p {
  border: 2px solid red;
  border-radius: 5px;
}

Prueba por ti mismo

Más ejemplos

Todas las propiedades del borde superior en una declaración
Este ejemplo muestra las propiedades abreviadas, que se utilizan para establecer todas las propiedades del borde superior en una declaración.
Establecer el estilo del borde inferior
Este ejemplo muestra cómo establecer el estilo del borde inferior.
Configurar el ancho del borde izquierdo
Este ejemplo muestra cómo configurar el ancho del borde izquierdo.
Configurar el color de todos los cuatro bordes
Este ejemplo muestra cómo configurar el color de todos los cuatro bordes. Puede tener de uno a cuatro colores.
Configurar el color del borde derecho
Este ejemplo muestra cómo configurar el color del borde derecho.

Todos los atributos de borde CSS

Atributo Descripción
border Atributo abreviado, configurar todos los atributos del borde en una declaración.
border-color Atributo abreviado, configurar el color de todos los cuatro bordes.
border-radius Atributo abreviado, configurar todos los cuatro atributos border-*-radius.
border-style Atributo abreviado, configurar el estilo de todos los cuatro bordes.
border-width Atributo abreviado, configurar el ancho de todos los cuatro bordes.
border-bottom Atributo abreviado, configurar todos los atributos del borde inferior en una declaración.
border-bottom-color Configurar el color del borde inferior.
border-bottom-style Configurar el estilo del borde inferior.
border-bottom-width Configurar el ancho del borde inferior.
border-left Atributo abreviado, configurar todos los atributos del borde izquierdo en una declaración.
border-left-color Configurar el color del borde izquierdo.
border-left-style Configurar el estilo del borde izquierdo.
border-left-width Configurar el ancho del borde izquierdo.
border-right Atributo abreviado, configurar todos los atributos del borde derecho en una declaración.
border-right-color Configurar el color del borde derecho.
border-right-style Configurar el estilo del borde derecho.
border-right-width Configurar el ancho del borde derecho.
border-top Atributo abreviado, configurar todos los atributos del borde superior en una declaración.
border-top-color Configurar el color del borde superior.
border-top-style Configurar el estilo del borde superior.
border-top-width Configurar el ancho de la borde superior.