Los datos expuestos en este blog, son solo de índole informativo. Por favor realiza siempre una copia de seguridad antes de realizar cualquier cambio en tu proyecto.
CSS: propiedad border-bottom-right-radius
Este tutorial de CSS explica cómo usar una propiedad de CSS llamada Radio de la esquina inferior derecha del borde Con sintaxis y ejemplos.
describir
La propiedad CSS border-bottom-right-radius define las esquinas redondeadas a la derecha del borde inferior del cuadro.
sintaxis
La sintaxis de la propiedad CSS border-bottom-right-radius es:
border-bottom-right-radius: value;parámetro o parámetro
valor
El valor del radio aplicado al lado derecho del borde inferior del cuadro. Puede ser uno de los siguientes:
| valor | describir |
|---|---|
| estable | valor fijo en px, em, … div {borde-inferior-derecho-radio: 4px; } |
| porcentaje | valor porcentual div {borde-inferior-derecho-radio: 8%; } |
| heredar | El elemento heredará el radio de la esquina inferior derecha del borde de su elemento principal div { borde-inferior-derecho-radio: heredar; } |
notas
- Consulte también las propiedades border-bottom-left-radius y border-radius.
Compatibilidad del navegador
La propiedad CSS border-bottom-right-radius tiene soporte básico para los siguientes navegadores:
- cromo 4
- Firefox 4+ (Geco 2+)
- Internet Explorer 9+ (IE 9+)
- Ópera 10.5+
- Safari 5+ (WebKit 3+)
ejemplo
Discutiremos la propiedad border-bottom-right-radius a continuación, explorando ejemplos de cómo usarla en CSS.
Veamos un ejemplo de un radio de esquina inferior derecha de borde CSS donde proporcionamos un valor de píxel.
div { border-bottom-right-radius: 3px; border-bottom-style: solid; }En este ejemplo de CSS border-bottom-right-radius, estamos en
A continuación, veremos un ejemplo de CSS border-bottom-right-radius que proporciona un valor em.
div { border-bottom-right-radius: 1em; border-bottom-style: solid; }En este ejemplo de CSS border-bottom-right-radius, definimos esquinas redondeadas de 1em en el lado derecho del borde inferior.