로날듀우

안녕하세요! border 옵션 질문드리겠습니다~!

· 2012-07-19 (목) 12:22:54 · 3802 · 7
border 가
 
css로
border:1px #ededed solid;
 
라 하면 현재 있는 width 와 height 포함 보더가 먹기때문에 collapse로 되어있는 table에는
td로 옵션이 안들어가잖아요...
 
이러한 경우에 collapse가 되어있는 td에 border:1px ~~~~ 옵션으로 값을 처리할 수 있나요??
 
아니면
 
위의 이미지 처럼
 
서택이 되어있으면 border에 background 처리고 mouseover 처리를 하면 저것처럼
 
배경이 하얗고 보더가 안으로 들어가서 나오게 되는데요 저것은 어떻게 처리를 한것입니까???
 
너무 굼굼해서요!
 
답변해주셨으면 좋겠습니다.
|

댓글 7개

2012-07-19 (목) 13:23:04
어느 사이트에서 캡쳐하신 건가요?
edgebook.com 이라는 쇼핑몰 순위를 나타내주는 메타사이트 입니다.
2012-07-19 (목) 14:22:47
table 로 한 건 아니구요
ul li 를 쓴 겁니다. 현재 원피스를 보고 있다손 치면, 원피스 li 에 class='now' 를 할당해주는 방법인데요.

저 사이트에서 쓴 방법이 정확히 어떤 건진 모르겠지만, 간단하게 예제를 만들어보자면
php 로 만들었다고 가정해서...

<ul>
<li <?if($cate=='all' || empty($cate)) echo "class='now'";?>>전체</li>
<li <?if($cate=='원피스') echo "class='now'";?>>원피스</li>
<li <?if($cate=='상의') echo "class='now'";?>>상의</li>
</ul>

이런 식으로 메뉴가 구성되고,

해당페이지에서 메뉴 불러오기 전에 $cate 가 먼저 호출되어서 class='now'를 어디에 넣어줄지 결정하겠죠.

css 에서 .now 를 만들어 해당하는 스타일을 넣어두시면 될 겁니다.
음... 저는 저것을 어떻게 쓴게 굼굼한게 아니라 그 CSS값을 어떻게 넣었는지 굼굼한데..
그 CSS 옵션을 알려주시면 안될까요?
2012-07-19 (목) 15:18:21
아하
그건 다른 고수님이 저는 천민이라서 ㅠ
ul list로 정렬했네용;;
ul li {border:1px solid #000} // 기본 li 스타일
ul li.now {border:1px solid #변경값} // now li 스타일
ul li a:hover {border:2px solid #eee;} // 마우스 올렸을때 변경

ul > li > a [이런 구조인듯한데용;;]
<ul>
<li class="now"><a></a></li>
<li><a></a></li>
</ul>
li는 그냥 now 클래스를 먹이냐 안먹이냐에 따른 디자인이 변경된것이고요
마우스를 올렸을땐 li 안에 a 태그의 스타일이 변경되는 것입니다.
a:hover로 마우스 올렸을때 안의 보더값을 줬기 때문에 table안에 td의 내부 보더값이 보인것처럼 보이는거죠;;

세부 소스는 직접 공부하시는게..ㅡ/.,ㅡ;;
댓글을 작성하시려면 로그인이 필요합니다.

프로그램

8,188건
+
제목 글쓴이 날짜 조회
13-07-14 조회 5,417
13-07-14 조회 5,392
13-07-14 조회 4,673
13-07-14 조회 4,275
13-07-14 조회 4,136
13-07-14 조회 4,201
13-07-14 조회 4,917
13-07-14 조회 4,559
13-07-14 조회 4,342
13-07-14 조회 5,386
13-07-14 조회 5,270
13-07-14 조회 5,054
13-07-14 조회 4,762
13-07-14 조회 5,445
13-07-13 조회 3,667
13-07-01 조회 5,707
13-07-01 조회 5,787
13-07-01 조회 3,888
13-07-01 조회 5,379
13-05-27 조회 3,971
13-05-21 조회 4,996
13-05-02 조회 1만
13-04-29 조회 5,202
13-04-15 조회 5,462
13-04-13 조회 6,402
13-02-27 조회 3,919
13-02-26 조회 6,464
13-02-12 조회 5,191
13-02-01 조회 2.3만
13-01-23 조회 3,499
13-01-09 조회 8,010
13-01-07 조회 4,935
13-01-07 조회 3,683
13-01-04 조회 1.3만
13-01-03 조회 1.2만
12-12-31 조회 6,309
12-12-27 조회 4,441
12-12-27 조회 4,136
12-12-27 조회 8,821
12-12-18 조회 3,627
12-12-12 조회 3,687
12-12-12 조회 6,725
12-12-12 조회 8,137
12-12-05 조회 5,411
12-12-01 조회 6,695
12-11-22 조회 4,611
12-11-09 조회 5,459
12-11-09 조회 7,533
12-10-29 조회 4,774
12-10-16 조회 6,330
12-10-09 조회 5,384
12-09-02 조회 4,475
12-09-01 조회 3,590
12-08-30 조회 4,236
12-08-30 조회 4,231
12-08-28 조회 3,560
12-08-21 조회 7,170
12-08-20 조회 3,689
12-08-18 조회 5,088
12-08-18 조회 3,459
12-08-11 조회 3,643
12-08-09 조회 3,792
12-08-07 조회 3,762
12-08-07 조회 4,335
12-08-01 조회 4,583
12-08-01 조회 4,465
12-07-20 조회 9,847
12-07-17 조회 4,222
12-07-15 조회 3,938
12-07-10 조회 4,245
12-07-09 조회 6,957
12-07-05 조회 3,276
12-07-04 조회 3,443
12-06-30 조회 5,701
12-06-28 조회 3,781
12-06-20 조회 3,919
12-06-16 조회 3,231
12-06-14 조회 3,875
12-06-07 조회 3,924
12-06-06 조회 6,258
12-05-27 조회 4,498
12-05-25 조회 3,250
12-05-25 조회 3,064
12-05-24 조회 3,201
12-05-24 조회 4,545
12-05-23 조회 3,902
12-05-22 조회 6,516
12-05-15 조회 3,867
12-05-15 조회 3,637
12-05-14 조회 3,063
12-05-12 조회 3,525
12-05-11 조회 7,023
12-05-07 조회 4,434
12-04-28 조회 3,643
12-04-25 조회 5,277
12-04-15 조회 3,868
12-04-12 조회 4,704
12-04-11 조회 3,456
12-04-08 조회 3,318
12-03-21 조회 6,372