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; <---------이것부터 지워고 다시 맞추시면 될듯요.
hover시에 밀려서 움직이는 현상을
.sct_10 .sct_li a {border:2px solid #fff}
로 해결할 수 있습니다 야매지만 ㅋㅋ