z-index :önce veya :öğesi altında sonra, bu mümkün mü?

SORU

13 HAZİRAN 2010, Pazar

z-index :önce veya :öğesi altında sonra, bu mümkün mü?

:after pseudo element CSS seçici unsur stil için çalışıyorum

elementTag{position:relative; z-index:1;}
elementTag:after{position:relative; z-index:0; content:" "; position:absolute; width:100px; height:100px;}

:after eleman eleman kendisi o zaman alt edilemez gibi görünüyor.

Bir şekilde sahte elemanı eleman daha sonra kendisini var mı?

CEVAP

30 Mayıs 2012, ÇARŞAMBA

Pseudo-elements ilgili eleman torunları olarak kabul edilir. Pseudo-element, üst altında bir konuma, new stacking context varsayılan yığın sırasını değiştirmek için oluşturmak zorunda.
Konumlandırma pseudo-element () mutlak ve atama, z-index değeri dışında bir “otomatik” yeni yığın bağlamı oluşturur.

#element { 
    position: relative;  /* optional */
    width: 100px;
    height: 100px;
    background-color: blue;
}

#element::after {
    content: "";
    width: 150px;
    height: 150px;
    background-color: red;

    /* create a new stacking context */
    position: absolute;
    z-index: -1;  /* to be below the parent element */
}

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Position a pseudo-element below its parent</title>
</head>
<body>
  <div id="element">
  </div>
</body>
</html>