---
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 | &lt;integer&gt; | <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> &lt;integer&gt; </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" } ) }}