CSS Z- 색인 문제

-1

첫 번째 클래스가 두 번째 클래스보다 가까워 지도록 z 인덱스 순서를 얻으려고합니다.CSS Z- 색인 문제

그러나 나는 내 인생에 박스 그림자를 보여줄 수 없다.

.title { 
     background-image: linear-gradient(bottom, rgb(249,252,249) 33%, rgb(255,255,255) 37%); 
     background-image: -o-linear-gradient(bottom, rgb(249,252,249) 33%, rgb(255,255,255) 37%); 
     background-image: -moz-linear-gradient(bottom, rgb(249,252,249) 33%, rgb(255,255,255) 37%); 
     background-image: -webkit-linear-gradient(bottom, rgb(249,252,249) 33%, rgb(255,255,255) 37%); 
     background-image: -ms-linear-gradient(bottom, rgb(249,252,249) 33%, rgb(255,255,255) 37%); 

     background-image: -webkit-gradient(
      linear, 
      left bottom, 
      left top, 
      color-stop(0.33, rgb(249,252,249)), 
      color-stop(0.37, rgb(255,255,255)) 
     ); 
     box-shadow: 0px 1px 5px rgba(0,0,0,1); 
     height: 50px; 
     z-index: 1; 
    } 

.banner { 
    background-image:url('images/grad.jpg'); 
    background-color:#cccccc; 
    height: 500px; 
    z-index: -1; 
}

그러나 이것은 나를 위해 작동하지 않습니다.

마크 업>

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="UTF-8"> 
<title>Design Test | PolyDevs</title> 
<link rel="stylesheet" type="text/css" href="style.css"> 
<div class="header"> 
    <div class="title"> 
     <div class="logo"> 
      <img src="images/banner.png"/> 
     </div> 
    </div> 
</div> 
</head> 
<body> 
<div class="banner"> 

</div> 
</body> 
</html>

출처

2013-10-26 Daniel Watson

HTML을 게시하십시오. –

마크 업 (HTML)을 공유 할 수 있습니까? 'z-index'는 [상대적으로 설정]되어 있습니다 (http://stackoverflow.com/questions/7482840/z-index-order-for-draggable-div/7482870#7482870) 마크 업 문제는 ... –

부모 배너의 요소는'position : relative'로 설정되어 있습니까? 나는 그것이 과거에 나를 트립되었음을 안다. – aviemet

위치 : 상대; 내 문제가 해결 됐어, 왜 그랬어?

절대 위치 요소는 상대 위치에있는 하나의 상위 요소로 배치됩니다. 어떠한 요소의 상대 위치에없는 경우

는

후, 그 위치의 기본 상대적으로 <body> 요소의 위치 "에서"지정 부모 (왼쪽, 오른쪽, 하단, 상단)

될 것 예 :

<body> 
<div class="posrelative"> 
    <div class="posabsolute">hello world</div> 
</div> 
</body>

안녕하세요 세계가 더 상위 래퍼 <div>이 될 것 위치에 따라 절대 위치 될 수이 될 수있다 채워 사이드 바, 또는 바닥 글 등 ...

<body> 
<div> 
    <div class="posabsolute">hello world</div> 
</div> 
</body>

안녕하세요 세계 이제 절대 위치 할 수 있지만, 더 이상 부모 <div>에서 위치를 기반으로하지,하지만 <body> 오프 위치에 따라 수, 기본적으로 브라우저 창의 전체 너비

출처

2013-10-26 23:52:51 Mark

CSS Z- 색인 문제

답변

관련 문제