English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
borda-top-left-A propriedade radius define o canto superior esquerdo da borda do elemento como arredondado.
A tabela a seguir fornece a descrição de uso e histórico de versão deste atributo, bem como a sintaxe de uso do atributo no script JavaScript.
| Valor padrão: | 0 |
|---|---|
| Aplicável a: | Todos os elementos |
| Herança: | Nenhum |
| Animável: | sim.Consulte Atributos de animação。 |
| Versão: | CSS3nova funcionalidade |
| Sintaxe do JavaScript: | object object.style.borderTopLeftRadius="8px" |
Atenção:borda-top-left-O atributo radius fará com que o fundo do elemento fique arredondado mesmo se o border não estiver definido ou se seu valor for none.
A sintaxe dessa propriedade é a seguinte:
borda-top-left-radius: [ length | percentage ]1 ou 2 values | initial | inherit
Este atalho pode usar um ou dois valores separados por um ou dois espaços.
O valor opcional do segundo comprimento define o raio vertical do canto superior esquerdo, portanto, a forma do canto é um quarto de elipse.
Se o segundo comprimento for omitido ou igual ao segundo comprimento, a forma da esquina é um quarto de círculo. Se qualquer comprimento for zero, a esquina é quadrada, não arredondada.
Os seguintes exemplos mostram como usar a borda-top-left-Atributo radius
div {
borda: 2px sólido #f08080;
borda-top-left-radius: 20px;
}Teste e veja‹/›A tabela a seguir descreve os valores dessa propriedade.
| Valor | Descrição |
|---|---|
| length | Valores de comprimento em unidades como px, pt, cm, em, etc., mas não é permitido usar valores negativos. |
| percentage | O tamanho do raio, em porcentagem. Em dois valores, o primeiro valor é calculado como uma porcentagem do largura da caixa do elemento (raio horizontal), e o segundo valor é calculado como uma porcentagem da altura da caixa do elemento (raio vertical). Não é permitido usar valores negativos. |
| initial | Defina essa propriedade para seu valor padrão. |
| inherit | Se especificado, o elemento relacionado adota a borda do elemento pai-top-left-Valores do atributo radius. |
borda-top-left-Compatibilidade do atributo radius entre navegadores, os números na tabela representam a versão mínima do navegador que suporta essa propriedade; todos os navegadores principais suportam essa propriedade.
|
Veja o tutorial:Borda do CSS，CSS3 Border。
Propriedades relacionadas:borda-radius，borda-bottom-left-radius，borda-bottom-right-radius，borda-top-right-radius。