"Se um trabalhador quiser fazer bem o seu trabalho, ele deve primeiro afiar suas ferramentas." - Confúcio, "Os Analectos de Confúcio. Lu Linggong"
Primeira página > Programação > Como consertar bordas irregulares nas transformações CSS 3D do Firefox?

Como consertar bordas irregulares nas transformações CSS 3D do Firefox?

Publicado em 2024-11-04
Navegar:923

How to Fix Jagged Edges in Firefox 3D CSS Transformations?

Transformação CSS 3D: combatendo bordas irregulares no Firefox

Paralelamente à questão das bordas irregulares com as transformações CSS do Chrome, surge um problema semelhante com o Firefox durante as transformações 3D. Uma ilustração pode ser encontrada neste JSFiddle (específico do Firefox): http://jsfiddle.net/78dK/5/.

Ao contrário do Chrome, backface-visibility não fornece uma solução no Firefox.

Soluções alternativas:

Solução alternativa 1 (atributo de contorno):

Para uma solução mais universal, considere adicionar um atributo de contorno transparente:

outline: 1px solid transparent;

Esta abordagem foi verificada no Firefox 10.0.2 Windows 7: http://jsfiddle.net/nKhr8/.

Solução alternativa 2 (atributo de borda):

Como alternativa, você pode adicionar um atributo de borda com uma cor que corresponda ao plano de fundo:

border: 1px solid white;

Esta opção é eficaz quando a cor de fundo é conhecida (por exemplo, branco neste caso): http://jsfiddle.net/LPEfC/.

Tutorial mais recente Mais>

Isenção de responsabilidade: Todos os recursos fornecidos são parcialmente provenientes da Internet. Se houver qualquer violação de seus direitos autorais ou outros direitos e interesses, explique os motivos detalhados e forneça prova de direitos autorais ou direitos e interesses e envie-a para o e-mail: [email protected]. Nós cuidaremos disso para você o mais rápido possível.

Copyright© 2022 湘ICP备2022001581号-3