Atributo border-top-left-radius de CSS

Definición y uso

El atributo border-top-left-radius define la forma del borde superior izquierdo.

Consejo:Esta propiedad le permite agregar bordes redondeados a los elementos.

Véase también:

Tutoriales de CSS3:Borde de CSS3

Ejemplo

Añade un borde redondeado a la esquina superior izquierda del elemento div:

div
{
border:2px solid;
border-top-left-radius:2em;
}

Prueba por tu cuenta

Sintaxis de CSS

border-bottom-right-radius: length|% [length|%];

Notas:El valor de longitud y el valor de porcentaje del atributo border-top-left-radius definen el radio (radii) de un cuarto de elipse (define la forma de la esquina del borde exterior). El primer valor es el radio horizontal, el segundo valor es el radio vertical. Si se omite el segundo valor, se copia el primer valor. Si el valor de longitud es cero, la esquina es cuadrada en lugar de circular. El porcentaje del radio horizontal se refiere al ancho de la caja del borde, y el porcentaje del radio vertical se refiere a la altura de la caja del borde.

Valor de la propiedad

Valor Descripción Pruebas
length Define la forma de la esquina inferior izquierda. Pruebas
% Define la forma de la esquina inferior izquierda en porcentajes. Pruebas

Detalles técnicos

Valor predeterminado: 0
Herencia: no
Versión: CSS3
Sintaxis de JavaScript: object.style.borderTopLeftRadius="5px"

Compatibilidad del navegador

Los números en la tabla indican la versión del navegador que admite completamente la propiedad.

Chrome IE / Edge Firefox Safari Opera
5.0
4.0 -webkit-		 9.0 4.0
3.0 -moz-		 5.0
3.1 -webkit-		 10.5