Z- 색인이 작동하지 않습니다. 예를 들어,

다음 div 중 하나에서 CSS3 곡선 그림자 효과를 얻으려고합니다. this과 같습니다. 그러나 Z- 인덱스 문제가 발생했습니다. 부모님을 상대적인 위치로 설정하고 더 높은 z- 인덱스를 설정하더라도 여전히 작동하지 않습니다. 의사 요소는 요소의 맨 위에 표시됩니다. 여기 내 문제도 아래 코드를 보여 Fiddle입니다. 어떤 도움을 많이 주시면 감사하겠습니다.Z- 색인이 작동하지 않습니다. 예를 들어,

HTML

<div class="app-home-body-banners"> 
    <div> 
     <ul style="height: 100px"> 
     </ul> 
     <br class="clear" /> 
    </div> 
</div>

CSS

.app-home-body-banners 
{ 
    position: relative; 
    z-index: 100; 
    margin: 20px 0px 20px 0px; 
    background-color: #E9E9E9; 
} 
.app-home-body-banners:before, .app-home-body-banners:after 
{ 
    content:""; 
    position:absolute; 
    z-index:-1; 
} 

.app-home-body-banners:before 
{ 
    top:0px; 
    bottom:0px; 
    left:10px; 
    right:10px; 
    -webkit-box-shadow:0 0 15px rgba(0,0,0,0.6); 
    -moz-box-shadow:0 0 15px rgba(0,0,0,0.6); 
    box-shadow:0 0 15px rgba(0,0,0,0.6); 
    -moz-border-radius:100px/10px; 
    border-radius:100px/10px; 
} 

.clear 
{ 
    float: none; 
    clear: both; 
    line-height: 1px; 
}

출처

2013-04-15 nicholasnet

을, 'content'와'z-index'를 사용하여 당신이 달성하고자하는 것은 무엇입니까? –

나는 이와 같은 것을 이루려고 노력하고 있습니다. http://www.paulund.co.uk/playground/demo/css_box_shadow/ – nicholasnet

왜 소스를 보지 않습니까? http://jsfiddle.net/TfusQ/ –

.APP - 가정 몸 배너에서 Z- 인덱스 제거 : 제가 질문을 이해하지 않았다 http://jsfiddle.net/7mMaT/9/

.app-home-body-banners { 
    position: relative; 
    margin: 20px 0px 20px 0px; 
    background-color: #E9E9E9; 
}

출처

2013-08-19 00:48:06 user1655416

Z- 색인이 작동하지 않습니다. 예를 들어,

답변

관련 문제