css 이미지 오버문제입니다. 채택완료
뒷집돌쇠
9년 전
조회 5,010
ㅠㅠ
이거원 무슨짓을 해도 검색을 해도 해결이 안되네요.
http://ami9812.dothome.co.kr/shop/">http://ami9812.dothome.co.kr/shop/
리스트 이미지에 마우스 오버시에 어두운 배경 씌우고 돋보기 아이콘 띄우려고 했더니
아웃라인 그림자(설정해놨습닏ㄷㄷㄷ)는 정상적으로 나오고
#000으로 배경색 잡아놨는데 흰색 배경으로 opacity값 적용되서 나오네요.
게다가 돋보기 아이콘은 로딩조차 못하고 있습니다.(경로는 몇번 확인했습니다. ㅠㅠ)
해당 메인리스트 스킨 css 입니다. ㅠ
</p><p>/* 메인(베스트) 상품목록 스킨 10 */</p><p>.sct_10 li{text-align:center;margin-bottom:20px;}</p><p>.sct_10 .sct_img{display:block;padding:10px}</p><p>.sct_10 .sct_img:hover img{</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>background:url(img/zoom.png);</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>background:#000;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>opacity:0.7;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>-moz-box-shadow: 0 0 10px #000;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>-webkit-box-shadow: 0 0 10px #000;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>box-shadow: 0 0 10px #000; </p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}</p><p> </p><p>.sct_10 .sct_img img{</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>width:100%;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>height:auto;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>-webkit-transition: all 0.5s ease;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>-moz-transition: all 0.5s ease;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>-ms-transition: all 0.5s ease;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>transition: all 0.5s ease;</p><p><span class="Apple-tab-span" style="white-space:pre"> </span>}</p><p> </p><p>.sct_10 .sct_cost {color:#ff405e;font-weight:bold;}</p><p>.sct_10 .sct_cost .cust_price{display:block;color:#696969;font-size:11px;font-weight:normal;text-decoration:line-through}</p><p>.sct_10 .sct_tit{text-overflow: ellipsis;overflow: hidden;white-space: nowrap;}</p><p> </p><p>.li_more{text-align:center;display:block;}</p><p>.li_more img{width:30px;margin:5px 0}</p><p>.li_more p{color:#aaa;margin-top:5px;display:none;}</p><p>.li_more .li_more_btn{clear:both;width:100%;display:block;}</p><p>.li_more button{background:#63a1b8;width:205px;padding:8px 0 ;font-size:0.917em;color:#fff;margin-top:45px;border:none;text-align:center;border-radius:5px}</p><p>
css는 넘나 어려운것 ㅠㅠ
댓글을 작성하려면 로그인이 필요합니다.
답변 1개
채택된 답변
+20 포인트
답변에 대한 댓글 1개
�
뒷집돌쇠
9년 전
댓글을 작성하려면 로그인이 필요합니다.
답변을 작성하려면 로그인이 필요합니다.
로그인
위 css 소스를 .sct_img 소스에 바로 발라놨더니
제품리스트명, 금액까지 .sct_img 영역 모두가 그레이계열로 덮히더라구요.
그리고 a href 속성이 감춰져버립니다. ㅠㅠ
그래서 .sct_img img속성에 발랐더니 역시나 반응이 없네요 ㅎㅎ
그래도 뭔가 희망을 봤다는데 진심으로 감사드립니다. ^^;
또 연구해봐야겠네요. ㅎㅎ