Atributo border-bottom-right-radius do CSS
- página anterior border-bottom-left-radius
- Próxima página border-bottom-style
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; }
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 |
- página anterior border-bottom-left-radius
- Próxima página border-bottom-style