http://m.cook.miznet.daum.net/
여기 보면 "인기요리분류" 부분에 표로 되어있는데요.
넓이 100%에서 창을 줄이면 똑같은 간격으로 글씨는 중앙에 위치하게 되는데요.
몇시간 동안 씨름하고 찾아보고 해도 제실력으로는 안되서 이렇게 문의 드립니다.
부탁좀 드리겠습니다. 초보에게 큰 빛이 됩니다. ㅠㅜ
여기 보면 "인기요리분류" 부분에 표로 되어있는데요.
넓이 100%에서 창을 줄이면 똑같은 간격으로 글씨는 중앙에 위치하게 되는데요.
몇시간 동안 씨름하고 찾아보고 해도 제실력으로는 안되서 이렇게 문의 드립니다.
부탁좀 드리겠습니다. 초보에게 큰 빛이 됩니다. ㅠㅜ
댓글 6개
13년 전
감싸주는곳은 100%로 하시고
나누어지는곳에 넓이를 각각 25%로 해주시고 글자는 가운데 정렬을 해주시면 됩니다.
나누어지는곳에 넓이를 각각 25%로 해주시고 글자는 가운데 정렬을 해주시면 됩니다.
13년 전
간단하게 테이블 코딩으로 나타내면
<style type="text/css">
.box{overflow:hidden;width:100%;border:1px solid #ddd;background-color:#f7f7f7;}
.box td{padding:10px;text-align:center;border-right:1px solid #ddd;}
.box .none{border:none}
</style>
<h3>인기 요리분류</h3>
<table cellspacing="0" cellpadding="0" border="0" width="100%" class="box">
<colgroup ><col width="25%"><col width="25%"><col width="25%"><col width="25%"></colgroup>
<tbody>
<tr>
<td>반찬</td>
<td>국물요리</td>
<td>별미일품</td>
<td class="none">밥죽</td>
</tr>
</tbody>
</table>
<style type="text/css">
.box{overflow:hidden;width:100%;border:1px solid #ddd;background-color:#f7f7f7;}
.box td{padding:10px;text-align:center;border-right:1px solid #ddd;}
.box .none{border:none}
</style>
<h3>인기 요리분류</h3>
<table cellspacing="0" cellpadding="0" border="0" width="100%" class="box">
<colgroup ><col width="25%"><col width="25%"><col width="25%"><col width="25%"></colgroup>
<tbody>
<tr>
<td>반찬</td>
<td>국물요리</td>
<td>별미일품</td>
<td class="none">밥죽</td>
</tr>
</tbody>
</table>
13년 전
새벽비님 감사합니다. 대부분 소스를 보니 div ul li 로 만들어져있길래 어떻게든 해보려 했으나 안되네요. 테이블이 역시 좋습니다. 감사합니다.^^~
13년 전
간단하게 짜봤습니다.
xhtml transitional 에서 테스트했습니다.
<style type="text/css" media="screen">
ul {float:left;margin:0;padding:0;width:500px;border:1px solid #ccc;background:#f7f7f7;list-style:none}
ul li {float:left;margin-left:-1px;padding:10px 0;width:25%;border-right:1px solid #eee;border-bottom:1px solid #eee;text-align:center}
.rt_none {border-right:none}
</style>
<ul>
<li>반찬</li>
<li>국물요리</li>
<li>별미일품</li>
<li class="rt_none">밥죽</li>
<li>도시락</li>
<li>샌드위치</li>
<li>베이커리</li>
<li class="rt_none">면요리</li>
</ul>
<div style="clear:both;height:0;overflow:hidden"><!-- --></div>
xhtml transitional 에서 테스트했습니다.
<style type="text/css" media="screen">
ul {float:left;margin:0;padding:0;width:500px;border:1px solid #ccc;background:#f7f7f7;list-style:none}
ul li {float:left;margin-left:-1px;padding:10px 0;width:25%;border-right:1px solid #eee;border-bottom:1px solid #eee;text-align:center}
.rt_none {border-right:none}
</style>
<ul>
<li>반찬</li>
<li>국물요리</li>
<li>별미일품</li>
<li class="rt_none">밥죽</li>
<li>도시락</li>
<li>샌드위치</li>
<li>베이커리</li>
<li class="rt_none">면요리</li>
</ul>
<div style="clear:both;height:0;overflow:hidden"><!-- --></div>
13년 전
지운아빠님 감사합니다. 늦게 봤습니다만 딱 원했던것입니다. 테이블로 쓰고 있었는데 정말 감사드립니다. 너무 잘됩니다.^^~
13년 전
음
게시판 목록
프로그램
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 5030 | 13년 전 | 772 | ||
| 5029 | 13년 전 | 458 | ||
| 5028 | 13년 전 | 712 | ||
| 5027 | 13년 전 | 1302 | ||
| 5026 | 13년 전 | 534 | ||
| 5025 | 13년 전 | 1340 | ||
| 5024 | 13년 전 | 405 | ||
| 5023 | 13년 전 | 647 | ||
| 5022 | 13년 전 | 413 | ||
| 5021 | 13년 전 | 652 | ||
| 5020 | 13년 전 | 500 | ||
| 5019 | 13년 전 | 843 | ||
| 5018 | 13년 전 | 894 | ||
| 5017 | 13년 전 | 777 | ||
| 5016 | 13년 전 | 2622 | ||
| 5015 | 13년 전 | 400 | ||
| 5014 | 13년 전 | 665 | ||
| 5013 | 13년 전 | 570 | ||
| 5012 |
JacobJeon
|
13년 전 | 1061 | |
| 5011 | 13년 전 | 792 | ||
| 5010 | 13년 전 | 1432 | ||
| 5009 |
JacobJeon
|
13년 전 | 1783 | |
| 5008 | 13년 전 | 1129 | ||
| 5007 | 13년 전 | 3000 | ||
| 5006 |
 몽키D팡야 |
13년 전 | 1279 | |
| 5005 | 13년 전 | 656 | ||
| 5004 | 13년 전 | 2075 | ||
| 5003 | 13년 전 | 2514 | ||
| 5002 | 13년 전 | 375 | ||
| 5001 | 13년 전 | 513 | ||
| 5000 | 13년 전 | 409 | ||
| 4999 | 13년 전 | 509 | ||
| 4998 | 13년 전 | 452 | ||
| 4997 | 13년 전 | 648 | ||
| 4996 | 13년 전 | 1897 | ||
| 4995 | 13년 전 | 374 | ||
| 4994 | 13년 전 | 371 | ||
| 4993 | 13년 전 | 515 | ||
| 4992 | 13년 전 | 481 | ||
| 4991 | 13년 전 | 374 | ||
| 4990 | 13년 전 | 690 | ||
| 4989 | 13년 전 | 630 | ||
| 4988 | 13년 전 | 384 | ||
| 4987 | 13년 전 | 400 | ||
| 4986 | 13년 전 | 1367 | ||
| 4985 | 13년 전 | 646 | ||
| 4984 | 13년 전 | 1030 | ||
| 4983 | 13년 전 | 401 | ||
| 4982 |
쥬드125
|
13년 전 | 997 | |
| 4981 | 13년 전 | 525 | ||
| 4980 | 13년 전 | 390 | ||
| 4979 | 13년 전 | 657 | ||
| 4978 | 13년 전 | 2160 | ||
| 4977 |
atria
|
13년 전 | 838 | |
| 4976 | 13년 전 | 1511 | ||
| 4975 | 13년 전 | 419 | ||
| 4974 | 13년 전 | 445 | ||
| 4973 | 13년 전 | 696 | ||
| 4972 | 13년 전 | 455 | ||
| 4971 | 13년 전 | 1383 | ||
| 4970 | 13년 전 | 350 | ||
| 4969 | 13년 전 | 398 | ||
| 4968 | 13년 전 | 712 | ||
| 4967 | 13년 전 | 507 | ||
| 4966 | 13년 전 | 429 | ||
| 4965 | 13년 전 | 572 | ||
| 4964 | 13년 전 | 574 | ||
| 4963 | 13년 전 | 415 | ||
| 4962 | 13년 전 | 2223 | ||
| 4961 | 13년 전 | 1316 | ||
| 4960 | 13년 전 | 1212 | ||
| 4959 | 13년 전 | 408 | ||
| 4958 | 13년 전 | 377 | ||
| 4957 | 13년 전 | 460 | ||
| 4956 | 13년 전 | 695 | ||
| 4955 | 13년 전 | 489 | ||
| 4954 | 13년 전 | 1056 | ||
| 4953 | 13년 전 | 1148 | ||
| 4952 | 13년 전 | 735 | ||
| 4951 |
sjsmsrjfflauswnrsmse
|
13년 전 | 864 | |
| 4950 | 13년 전 | 1898 | ||
| 4949 | 13년 전 | 2213 | ||
| 4948 | 13년 전 | 5518 | ||
| 4947 | 13년 전 | 406 | ||
| 4946 | 13년 전 | 848 | ||
| 4945 | 13년 전 | 400 | ||
| 4944 | 13년 전 | 604 | ||
| 4943 |
마당쇠2000
|
13년 전 | 1255 | |
| 4942 |
cula100jak
|
13년 전 | 823 | |
| 4941 | 13년 전 | 468 | ||
| 4940 | 13년 전 | 564 | ||
| 4939 | 13년 전 | 397 | ||
| 4938 | 13년 전 | 543 | ||
| 4937 | 13년 전 | 1474 | ||
| 4936 |
techer
|
13년 전 | 1812 | |
| 4935 | 13년 전 | 704 | ||
| 4934 | 13년 전 | 929 | ||
| 4933 | 13년 전 | 2021 | ||
| 4932 |
kajama78
|
13년 전 | 936 | |
| 4931 | 13년 전 | 975 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기