Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.
Aprenda Desafio: Controlar Z-Index e Sobreposição de Elementos | Dominando o Posicionamento em CSS
Layout CSS, Efeitos e Sass

bookDesafio: Controlar Z-Index e Sobreposição de Elementos

Tarefa

Crie um fundo visualmente atraente para o site utilizando uma ilustração composta por 5 imagens diferentes. Todas as imagens devem estar corretamente posicionadas dentro do quadro do elemento pai div. Sua tarefa é ajustar a ordem de sobreposição utilizando a propriedade z-index para alcançar o resultado desejado conforme ilustrado na imagem abaixo:

index.html

index.html

index.css

index.css

copy

Para alterar a ordem de empilhamento das imagens dentro do elemento pai div, utilize a propriedade z-index. Um valor de z-index mais alto, como 1, eleva o elemento acima dos outros no contexto de empilhamento, tornando-o visível em primeiro plano.

index.html

index.html

index.css

index.css

copy

Tudo estava claro?

Como podemos melhorá-lo?

Obrigado pelo seu feedback!

Seção 2. Capítulo 11

Pergunte à IA

expand

Pergunte à IA

ChatGPT

Pergunte o que quiser ou experimente uma das perguntas sugeridas para iniciar nosso bate-papo

Suggested prompts:

Can you show me the HTML structure for the images inside the parent div?

Which image should be on top according to the reference image?

Can you explain how the images are currently stacked without z-index?

bookDesafio: Controlar Z-Index e Sobreposição de Elementos

Deslize para mostrar o menu

Tarefa

Crie um fundo visualmente atraente para o site utilizando uma ilustração composta por 5 imagens diferentes. Todas as imagens devem estar corretamente posicionadas dentro do quadro do elemento pai div. Sua tarefa é ajustar a ordem de sobreposição utilizando a propriedade z-index para alcançar o resultado desejado conforme ilustrado na imagem abaixo:

index.html

index.html

index.css

index.css

copy

Para alterar a ordem de empilhamento das imagens dentro do elemento pai div, utilize a propriedade z-index. Um valor de z-index mais alto, como 1, eleva o elemento acima dos outros no contexto de empilhamento, tornando-o visível em primeiro plano.

index.html

index.html

index.css

index.css

copy

Tudo estava claro?

Como podemos melhorá-lo?

Obrigado pelo seu feedback!

Seção 2. Capítulo 11
some-alt