Cursos / Informática para Internet / Autoria Web / Aula

arrow_back Aula 07 - CSS: modelo de caixas, bordas, dimensões e posicionamento

Sobreposição de Elementos

A propriedade z-index especifica se o elemento deve ser colocado na frente ou por trás de outros, quando eles usam um método de posicionamento que possibilita a sobreposição.

Essa propriedade pode assumir um inteiro que indicará a ordem de sobreposição, aquele que tiver maior valor ficará em cima dos que têm menor valor. Se os elementos descritos tiverem posições que se sobrepõem, mas não tiverem a propriedade z-index, então, o elemento que for escrito por último no HTML será posto em cima dos demais, como ocorre na Figura 9 com os parágrafos 3 e 4.

Dessa forma, para fazer com que o parágrafo 3 apareça por cima do parágrafo 4, é necessário adicionar a propriedade z-index=1 ao CSS relativo ao parágrafo 3, veja o resultado na Figura 10.

Exemplo do uso da propriedade z-index

Enfim, agora você poderá colocar os elementos dispostos de várias maneiras e não um abaixo do outro como vinha fazendo. Entretanto, isso não é tudo, vamos fazer um exercício? Em seguida, nós continuamos com as propriedades referentes à posição dos elementos.

Versão 5.3 - Todos os Direitos reservados