Atributo border-bottom-right-radius do CSS

Definição e uso

A propriedade border-bottom-right-radius define a forma da borda no canto inferior direito.

Dica:Essa propriedade permite que você adicione bordas arredondadas ao elemento.

Veja também:

Tutorial de CSS3:Bordas do CSS3

Exemplo

Adicione bordas arredondadas no canto inferior direito do elemento div:

div
{
border:2px solid;
border-bottom-right-radius:2em;
}

Experimente você mesmo

Sintaxe do CSS

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

Nota:O valor da propriedade border-bottom-right-radius e o valor em porcentagem definem o raio (radii) do quarto círculo (define a forma dos cantos externos da borda) do quadrante inferior direito. O primeiro valor é o raio horizontal, e o segundo valor é o raio vertical. Se o segundo valor for omitido, ele copiará o primeiro valor. Se o comprimento for zero, o canto será quadrado, não circular. O valor percentual do raio horizontal se reflete na largura da caixa de borda, e o valor percentual do raio vertical se reflete na altura da caixa de borda.

Valor da propriedade

Valor Descrição Teste
length Define a forma do canto inferior direito. Teste
% Define a forma do canto inferior direito em porcentagem. Teste

Detalhes técnicos

Valor padrão: 0
Herança: não
Versão: CSS3
Sintaxe do JavaScript: object.style.borderBottomRightRadius="5px"

Suporte do navegador

Os números na tabela indicam a primeira versão do navegador que suporta completamente essa propriedade.

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