탭을 만들고 있는데요.
탭을싸고있는 보더도 over 나 on이 될 때,컬러가 같이 바뀌어야하거든요.
디자인 파일은 위와 같습니다.
백그라운드 이미지를 사용하지 않고 그냥 보더를 사용해서 잡아보다가 멘붕이와서 글올려요 ㅠ_-;
그냥 보더로 처리가 안되는 탭인가요?...
꼭 이미지를 써야하는 탭인가요? 감이안오네여
보더로 될듯해서 잡다가 ㅠ_-;; 잘안잡히네여...
저번에 탭 짤때탭이 떯어지지 않고 라인이 겹치는 탭 질문을 올렸던적이있는데요.
그때 margin-left:1px 로 살짝 옆으로 밀어서 가운데 라인을 1px 로 잡으라는 조언을 받았기에 이번에도 저렇게 작업했습니다.
현재 여기까지 잡았습니당..
아 free_tab_bg.jpg 파일은 width:1px; height:34px; 짜리 그라데이션 bg 이미지 입니다;
첨부가 안되네여;; ㅠ_ㅠ 저위에 진한색 부분 그냥 BG 입니당.style.gogogo {width:1000px; margin:0 auto;}
.free_tab {margin-top:20px;width:100%; border-bottom:3px solid #3d3109; height:34px; }
.free_tab li {float:left; border-top:1px solid #ac8616; border-left:1px solid #ac8616; border-right:1px solid #ac8616; color:#6c560f;}
.free_tab li a{width:98px; height:26px;display:block; text-align:center; padding-top:7px; font-size:13px; font-weight:600;}
.freeTab02, .freeTab03, .freeTab04, .freeTab05 {margin-left:-1px;}
.freeTab01 a:hover {background:url(free_tab_bg.jpg) repeat-x 0 0; color:#fff;}
/stylebody
div class=gogogo
ul class=free_tab
li class=freeTab01a href=javascript:void(0) class=on전체/a/li
li class=freeTab02a href=javascript:void(0) 일반/a/li
li class=freeTab03a href=javascript:void(0) 질문/a/li
li class=freeTab04a href=javascript:void(0) 공략/a/li
li class=freeTab05a href=javascript:void(0) 내글/a/li
/ul
/div
/body