在頁面設計中，層級樣式是非常重要的。它可以讓網頁元素按照自己的需求進行布局和排列。然而，有的時候我們在設置層級樣式時會遇到無法生效的問題。

以下是一個設置層級樣式失敗的例子：

.parent {
background-color: red;
width: 300px;
height: 200px;
position: relative;
}
.child {
background-color: blue;
width: 200px;
height: 100px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: -1;
}

在這個例子中，我們有一個父元素和一個子元素。父元素有相對定位，而子元素有絕對定位并且設置了z-index為-1。我們預期子元素應該在父元素的下方，但實際上子元素的背景色并沒有顯示出來。這是因為我們設置的z-index為負值，導致子元素被父元素所遮蓋。

我們可以在父元素上設置一個z-index的值，來解決這個問題：

.parent {
background-color: red;
width: 300px;
height: 200px;
position: relative;
z-index: 0;
}
.child {
background-color: blue;
width: 200px;
height: 100px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: -1;
}

在這個例子中，我們在父元素上設置了z-index的值，將其設置為0。這個值將父元素放置在子元素的下方。然后我們再將子元素的z-index值設為-1，讓子元素放置到其他所有元素的最下層。

總之，在設置層級樣式時，我們需要注意z-index屬性的值。如果需要讓后來的元素處于上層，則將其z-index屬性值設為較大的正數；如果需要讓元素處于下層，則將其z-index屬性值設為較小的負數。