css 부분 문의 드립니다. 마우스 오버시
본문
/* 메인 상품 목록 스킨 10 */
.smt_20 {position:relative;overflow-y:hidden}
.smt_20 .sct_ul {position:absolute;top:0;left:0;margin:0;padding:0;list-style:none}
.smt_20 .sct_ul_first {display:block;top:0}
.sct_10 .sct_li {position:relative;float:left;margin:-1px 0 0 -1px;padding:10px;border:1px solid #ccc;}
.sct_10 .sct_last {margin:-1px 0 0 !important}
.sct_10 .sct_clear {clear:both}
.sct_10 .sct_a {display:inline-block;position:relative;text-decoration:none}
.sct_10 .sct_a:focus, .sct_10 .sct_a:hover {text-decoration:none}
.sct_10 .sct_img {margin:0 0 10px;}
.sct_10 .sct_txt {margin:0 0 5px;text-align:center;}
.sct_10 .sct_icon {margin:0 0 10px;text-align:center;}
.sct_10 .sct_id {display:block;margin:0 0 5px;text-align:center;}
.sct_10 .sct_basic {margin:0 0 10px;text-align:center;}
.sct_10 .sct_cost {margin:0 0 10px;font-weight:bold;text-align:center;}
.sct_10 .sct_cost strike {margin:0 0 5px;padding:0 0 10px;color:#999;font-weight:normal}
.sct_10 .sct_sns {text-align:center;}
.scr_10 .sct_li {position:relative;float:left;margin:0 25px 15px 0}
.scr_10 .sct_last {margin:0 0 15px !important}
.scr_10 .sct_clear {clear:both}
.scr_10 .sct_a {display:inline-block;position:relative;text-decoration:none}
.scr_10 .sct_a:focus, .sct_10 .sct_a:hover {text-decoration:none}
.scr_10 .sct_img {margin:0 0 10px}
.scr_10 .sct_txt {margin:0 0 5px}
.scr_10 .sct_icon {margin:0 0 10px}
.scr_10 .sct_id {display:block;margin:0 0 5px}
.scr_10 .sct_basic {margin:0 0 10px}
.scr_10 .sct_cost {display:block;margin:0 0 10px;font-weight:bold}
.scr_10 .sct_cost strike {display:block;margin:0 0 5px;color:#999;font-weight:normal}
.scr_10 .sct_sns {}
위 style 을 복사 해서 넣었는데...
마우스 오버시 강조기능을 넣고 싶은데.. 부탁드립니다.
마우스가 올라갔을때 테두리가 빨간색으로 바뀌는것을 어디를 수정하면될까요? ㅠㅠ
하나하나 하면서 배워가긴 하는데 너무 힘들군요.ㅠㅠ
또한가지는 아래사진과같이
맨우측 상품의 좌측선만 두껍습니다. 선이 겹치지않고 떨어져있어서 선이 2개로 보이는듯한데.
어디를 수정하면 한줄로 보일까요?
답변 4
.sct_10 .sct_li {
border:1px solid #ccc;
margin-top:-1px
margin-left:-1px
z-index:9;
}
.sct_10 .sct_li:hover {
z-index:99;
border:1px solid #red;
}
감사합니다. :) 하나 하나 알아가는게 재밌기는하지만, 힘드네요. :(
사이트 URL을 알려주시면 답변이 쉬울거같습니다.
마우스오버시 보더색 넣기입니다.
클래스이름 a:hover {border:1px solid #컬러;}
감사합니다.
마우스오버
.sct_10 .sct_li a:hover {border:2px solid red}
선두개
.sct_10 .sct_li { margin-right: 40px; margin-bottom: 40px; <---------이것부터 지워고 다시 맞추시면 될듯요.
마우스 오버는 해보았는데. 크기가 늘어나면서 박스가 밀려서 움직이는 효과가 나오게 되네요. ㅠㅠ
상품사진에 테두리가 나오는게 아니라, 전체 박스 선에 테두리가 나오게 하는 것이 였고요.
연구해봐야하는데. 모르니까. 답답하네요.ㅠㅠ
선두개 처리부분은 지우란 부분을 찾아보는데 저부분이 안보이는데 어디서 찾아야하는것인지요?
해당 css 부분을 찾아봐도. 적어주신 부분이 없어여.ㅠㅠ
테마를 쓰고있기 때문에 테마 skin sytel.에 있을텐데...;;;
hover시에 밀려서 움직이는 현상을
.sct_10 .sct_li a {border:2px solid #fff}
로 해결할 수 있습니다 야매지만 ㅋㅋ
참고하겠습니다.
