그림자효과 주기 위해 :before,:after 태그를 사용했는데 적용이 안되요..
한말글
아래처럼 변형된 그림자 효과를 테스트히가ㅣ 위해 간단하게 만들었습니다.
그런데 z-index를 해제 해보면 분명히 그림자 생기는 각도 틀어진 형태가 있는데.. 뒤로 숨겨져서 그림자만 나와야하는데..z-index를 적용하면 다 안보입니다. ㅠㅠ ㅠㅠ도져히 이유를 모르곘네요.. 몬가 빠뜨린거 같기도하고.. 근데 몬지는 몰겠네요..크롬에서 테스트 중입니다. 아시는 분 답변 부탁드려요~..
bodydiv class=wrapper div class=box/div/div/body
.box {position:relative;width:300px;height:80px;background:#f6769a;margin:0 auto;}.box:before {z-index: -1;position: absolute;content: :bottom:10px;left: 10px;width: 50%;top: 80%;max-width:300px;background: #777;-webkit-box-shadow: 0 15px 10px #777;-moz-box-shadow: 0 15px 10px #777;box-shadow: 0 15px 10px #777;-webkit-transform: rotate(-3deg);-moz-transform: rotate(-3deg);-o-transform: rotate(-3deg);-ms-transform: rotate(-3deg);transform: rotate(-3deg);}