5
respostas

Nao consegui entender

nao consegui entender nada do exercicio.

5 respostas

Qual exercício amigo posta alguma coisa para tentarmos te ajudar

Vou escrever um fluxo de ideias aqui, Jhones. Me diga se fica mais fácil:

Nosso objetivo é Desenhar um Cubo em 3D

  • Para isso, criaremos uma div com a classe cubo.

  • Essa div terá todas as faces do nosso cubo, por isso criamos 6 divs dentro da div cubo.

  • Lembre-se que por padrão, as divs ficarão em 2D, por isso precisaremos adicionar as propriedades 3D para transformar cada uma das faces em suas devidas posições . Por isso, criamos a classe face que contem atributos em comum de todas as faces

.face {
  display: block;
  width: 200px;
  height: 200px;
  position: absolute;
  top: 0;
  left: 0;
}

e depois criamos uma classe especifica para cada face do nosso cubo: frente, direita, esquerda, cima, baixo, tras. por exemplo:

.frente {
  background-color: red;
  transform: translateZ(100px);
}
.direita {
  background-color: blue;
  transform: translateX(100px) rotateY(90deg);
}
  • Repare que na face da frente, só queremos traze-la mais perto do ponto de origem (baseado na nossa perspectiva olhando para a tela). Enquanto isso, na face da direita queremos que ela fique na direita (: por isso antes de trazê-la para frente (com um translate de 100px), fazemos a rotação de 90 graus da face no eixo Y.

E assim foi feito para cada uma das faces.

Ficou mais claro o objetivo do exercicio e como ele deve ser resolvido?

eai Jhones, minha dica é comece por Curso HTML5 e CSS3 I: Suas primeiras páginas da Web. vc terá uma compreensão melhor sobre os exercícios!

Sinceramente, eu fiz o curso I, e tenho certa experiência com HTML e estou boiando no assunto. Eu sinto que consigo fazer copiando e colando, mas não consigo desenvolver nada sem os exemplos. A absorção desse capítulo em específico tem sido rasa, de tão desinteressante e massante estou torcendo para acabar o quanto antes para seguir no curso. Gostaria de ver outros tipos de exemplos, ou então algum outro tipo de explicação que facilite a linha de aprendizado.