Os seguintes atributos não são bons para a compatibilidade do navegador.
1.Transform: Gire (45deg)
2.Borda-top-left-Radius Esta propriedade permite adicionar bordas arredondadas aos elementos
3.D-RADIUS Esta propriedade permite adicionar bordas arredondadas aos elementos
4. A propriedade de Shadow Box adiciona uma ou mais sombras à caixa
5. A propriedade de Shadow Text define uma sombra para o texto
6. Transição
Para ser melhor compatível com cada navegador, são necessários prefixos.
-o- /*navegador de ópera* /
-webkit- /*webkit kernel navegador safari e chrome* /
-ms- /*ie 9* /
-moz- /*navegador do Firefox* /
1.Transform: Gire (45deg) O objeto é girado através da propriedade Transform, onde (45deg) é o ângulo de rotaçãoTransformar: girar (45deg);
-ms-transform: girate (45deg); /*Ou seja, 9*/
-o-transform: girate (45deg); /*Navegador de ópera*/
-webkit-transform: girate (45deg); /*WebKit Kernel Browser Safari e Chrome*/
-moz-transform: girar (45deg); /*Navegador do Firefox*/
2. Borda-radius-radius-radio-radio-de-borda Esta propriedade permite adicionar bordas arredondadas aos elementosO primeiro pode escolher a posição em que a borda arredondada é adicionada
Top-top-left-radius, borda-de-top-right-radius, borda-garganta-esquerda-Radio, borda-de-garoto-rodo
Radio de borda-top-esquerda Esta propriedade permite adicionar bordas arredondadas aos elementos, assim como o Radio de Fronteira, apenas para controlar onde as fronteiras arredondadas precisam ser adicionadas.
3. A propriedade de sombra de caixa adiciona uma ou mais sombras à caixa, e a propriedade de Shadow Text define uma sombra para o textoShadow de caixa: H-Shadow || V-Shadow || Blur || espalhamento || cor || inserir;
Propriedades: posição da sombra horizontal || Posição da sombra vertical || Distância do desfoque || Tamanho da sombra || Cor da sombra || Mude a sombra externa (início) para a sombra interna
Box-Shadow: 1px 1px 3px #292929;
Shadow de texto: H-Shadow || V-Shadow || Blur || cor;
Shadow de texto: 0px -1px 0px #000;
4.Transiçãopropriedade || duração || Função de tempo || atraso
Especifica o nome do atributo CSS que define o efeito de transição || Especifica quantos segundos ou milissegundos necessários para concluir o efeito de transição || Especifica a curva de velocidade do efeito de velocidade || Define quando o efeito de transição começa
Atualmente, todos os navegadores não suportam o atributo de transição.
facilitar o padrão. A animação começa a uma velocidade baixa e depois acelera, desacelerando antes que termine.
A animação facilitada começa a uma velocidade baixa.
A animação de facilidade termina em baixa velocidade
A animação de facilidade de saída começa e termina em baixa velocidade
Transição: Antecedentes 5s facilitar;
Um por exemplo:
Copie o código