blob: 0ff10133625974274ab696a8091336014f22b9c2 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
|
---
title: z-index
slug: Web/CSS/z-index
tags:
- Referencia_CSS
translation_of: Web/CSS/z-index
---
<p>
{{ CSSRef() }}
</p>
<h3 id="Resumo" name="Resumo"> Resumo </h3>
<p>A propriedade <code>z-index</code> especifica a ordem-z de um elemento e de seus herdeiros. Quando os elementos sobrepõem, a z-ordem determina qual elemento cobre o outro.
</p>
<ul><li> Valor inicial: auto;
</li><li> Aplica-se a: elementos posicionados;
</li><li> Herdado: não;
</li><li> Mídia: <a href="pt/CSS/Media/Visual">Visual</a>;
</li><li> Valor computado: como especificado.
</li></ul>
<h3 id="Sintaxe" name="Sintaxe"> Sintaxe </h3>
<p>z-index: auto | <integer> | <a href="pt/CSS/inherit">inherit</a>
</p>
<h3 id="Valores" name="Valores"> Valores </h3>
<dl><dt> auto </dt><dd> O elemento é desenhado na mesma ordem-z como um elemento com <code>z-index: 0</code>. Isto <i>não</i> cria uma nova pilha de contexto.
</dd><dt> <integer> </dt><dd> O elemento é desenhado na ordem-z dada. Isto cria também uma nova pilha de contexto, que significa que todos os descendentes também terão o desenho no mesmo z-index. Dessa forma os z-indexes dos descendentes não são comparados aos z-indexes dos elementos do lado de fora deste elemento.
</dd></dl>
<p><span class="comment">== Exemplos ==</span>
</p>
<h3 id="Notas" name="Notas"> Notas </h3>
<p>Valores <code>z-index</code> negativos são suportados corretamente iniciando em <a href="pt/Gecko">Gecko</a> 1.9 / <a href="pt/Firefox_3_para_desenvolvedores">Firefox 3</a>. Versões mais antigas implementaram o comportamento do CSS 2, não o comportamento do CSS 2.1 que é compatível com outros navegadores.
</p>
<h3 id="Especifica.C3.A7.C3.B5es" name="Especifica.C3.A7.C3.B5es"> Especificações </h3>
<ul><li> <a class="external" href="http://www.w3.org/TR/CSS21/visuren.html#propdef-z-index">CSS 2.1</a>
</li></ul>
<p><span class="comment">== Compatibilidade com navegadores ==</span>
</p>
<h3 id="Veja_tamb.C3.A9m" name="Veja_tamb.C3.A9m"> Veja também </h3>
<p>{{ Cssxref("position") }}
</p><p><span class="comment">Categorias</span>
</p><p><span class="comment">Interwiki Language Links</span>
</p>{{ languages( { "en": "en/CSS/z-index", "fr": "fr/CSS/z-index", "pl": "pl/CSS/z-index" } ) }}
|
