CSS에서 Z축을 따른 요소 겹침
이번 강의에서는 Z축을 따른 요소 겹침을 살펴보겠습니다. 기본적으로, 두 요소가 서로 겹칠 경우, HTML 코드에서 더 아래에 있는 요소가 위에 표시됩니다.
예제를 통해 살펴보겠습니다. 서로 겹치도록 절대 위치가 지정된 두 개의 요소가 있다고 가정해 봅시다. 이 경우, HTML 코드에서 더 아래에 있는 요소가 위에 나타납니다:
<div id="elem1"></div>
<div id="elem2"></div>
#elem1 {
position: absolute;
top: 30px;
left: 30px;
width: 100px;
height: 100px;
background: #ff8888;
}
#elem2 {
position: absolute;
top: 60px;
left: 60px;
width: 100px;
height: 100px;
background: #7e89eb;
}
: