Solucionado (ver solução)
Solucionado
(ver solução)
3
respostas

Dúvida na montagem do Cubo 3D - perspective

Olá a todos!

Eu estava tentando montar o cubo 3D e estava tendo bastante dificuldade para encaixar os lados.

Na verdade, não foi de forma alguma, pelo menos assim pensei. No entanto eu estava utilizando um atributo no .cubo, que era o perspective. e quando desisti e olhei a resposta, vi que não foi utilizado esse atributo.

Quando removi o atributo perspective tudo se montou perfeitamente, o que me fez questionar a usabilidade desse atributo.

Quando atribuía valores pequenos, o cubo ficava todo zuado, alguém pode me explicar o motivo e a aplicabilidade desse atributo perspective?

3 respostas
solução!

Opa Bruno, tudo bem?

Então, pelo que eu li lá no exercício do cubo não precisa de perpective mesmo. Vc desloca e encaixa os lados do cubo apenas com transform: translate em todos os eixos (x,y,z).

O perspective ele teria a função de trazer algum elemento da tela para mais próximo ou mais distante.

Site da documentação : https://developer.mozilla.org/en/docs/Web/CSS/perspective

Ou seja, o translateZ() já cumpre essa função, se vc colocar os dois ele deve dar uma bugada mesmo e trazer o elemento muito para frente ou para trás.

(:

Espero ter ajudado! Qualquer coisa só dar um toque.

Abraços!

Opa Yuri,

A sua explicação junto com a documentação do link deixou a coisa bem mais clara.

Apenas com a explicação do vídeo não deu pra entender perfeitamente a diferença que o atributo perspective causa no elemento.

Ainda não achei muito sentido no uso do atributo, uma vez que é bem mais intuitivo organizar algum elemento 3D sem usá-lo, mas acredito que seu uso fique mais claro através de algum efeito animado que mude os valores da perspectiva dinamicamente.

De toda forma, valeu pela resposta.

Também estou com essa dúvida, porque no exercicio: https://cursos.alura.com.br/course/avancando-html-css/task/6139 precisou usar esse atributo para que as palavras ficassem em 3D. Se tirar o perspective, as palavras não são ampliadas e não dá o efeito 3D. Gostaria de saber, porque no exemplo do cubo não precisa e nesse que eu citei precisa ?