아래의 jsfiddle와 비슷한 효과를 얻으려고합니다. 기본적으로 반대 방향으로 HTML 목록을 레이어하고 싶습니다.다차원 HTML 목록 레이어링 방향 변경
목표는 상위 목록 요소를 하위 목록 요소 위에있는 것처럼 보이게하는 것입니다. 바이올린에서는 상자 그림자를 더 잘 보여주기 위해 자식 요소에 여백 위쪽이 있습니다. 내 목표는 margin-top을 5px에서 -5px으로 변경하고 해당 하위 항목을 상위 아래에 표시되도록하는 것입니다.
Z-색인을 보여 아이
opacity: 0.5;
A FIDDLE의 불투명도를 설정할 수 있습니다. 이 경우에는 relative으로 설정하면됩니다.
See this Fiddle 코드를 기반으로합니다.
참고 : 여백을 5px 대신 0px로 설정 했으므로 하위가 상위 아래로 들어갑니다. 더 많은 간격을 얻으려면 margin-top 대신 padding-top을 사용하는 것이 좋습니다.
내가 목표를 완전히 이해하고 있는지 확실하지 않습니다. 그 아이는 이미 부모보다 아래에있다. 당신이 '뒤에'을 의미하는 경우, 당신은 단지 당신이 position 속성을 설정할 때 작동합니다
아하, 위치 속성은 Z- 색인을 가져 오는 누락 된 링크입니다. # ff의 배경색을 피들에 추가하여 효과를 더했습니다. – Mike