css中的z-index属性是为了控制元素在层叠顺序中的位置，即控制元素的显示位置。它可以被应用于定位元素及一些其他的容器元素中。以下是对该属性使用的详细介绍。

要使用z-index属性，需要先为元素指定定位方式（即position属性）。只有定位元素（如relative、absolute、fixed）才可以使用z-index属性。在默认情况下，元素的z-index值为0。

div {
position: relative;
z-index: 1;
}

对于具有相同定位方式的元素，后面的元素会覆盖在前面的元素之上。但是，通过使用z-index属性，可以改变元素的显示顺序。

div:first-child {
z-index: 5;
}
div:nth-child(2) {
z-index: 3;
}
div:last-child {
z-index: 1;
}

在上面的代码中，第一个div元素具有最高的z-index（即5），所以它将会出现在其他两个元素的上面。同理，第二个div元素具有中等的z-index（即3），最后一个div元素具有最低的z-index（即1）。

如果在元素内部使用了另一个定位元素，且其z-index值比外部元素高，则该内部元素会出现在该外部元素之上。这种情况可以通过设置外部元素的z-index值高于内部元素来解决。

div {
position: relative;
z-index: 2;
}
div p {
position: relative;
z-index: 1;
}

在上面的代码中，外部div元素的z-index值为2，内部p元素的z-index值为1。由于外部元素具有更高的z-index值，所以该元素将会遮挡内部元素，达到预期的显示效果。

通过使用z-index属性，可以改变元素在层叠顺序中的位置，实现更灵活的元素显示效果。