묻고답하기
div 에 대해서..
2007.11.09 01:11
테이블을 잘 쓰다가 제로보드XE 를 접하면서 DIV 에 심각하게 부딪히게 되었습니다.
근데 아무리봐도 너무 어려워용. 햇깔리구요.
아직 처음이라 그런지 개념잡기도 어렵구요.
왜 갑자기 div 를 사용해서 흑흑..
만약 2x3 표를 만든다면 어떻게 되는걸까요?
<table border="1">
<tr>
<td width="33%"> </td>
<td width="34%"> </td>
<td width="33%"> </td>
</tr>
<tr>
<td width="33%"> </td>
<td width="34%"> </td>
<td width="33%"> </td>
</tr>
</table>
테이블로 만든다면 위와같이 될텐데,
이것을 div 로 만든다면 어떻게 코딩을 해야 하나요?
한줄에 박스 하나밖에 못넣던데.. 어떻게 해야 두개, 세개를 넣을 수 있지요?
그리고, <ul> <li> <ol> 등과 같은것도 연관이 있나요?
아 어려워용. ㅠ.ㅠ
너무 초보적인거 묻는다구 혼내지 마세용. ㅠ.ㅠ
div 에 대한 참고할만한 사이트나 강좌좀 소개 부탁드릴께요.
근데 아무리봐도 너무 어려워용. 햇깔리구요.
아직 처음이라 그런지 개념잡기도 어렵구요.
왜 갑자기 div 를 사용해서 흑흑..
만약 2x3 표를 만든다면 어떻게 되는걸까요?
<table border="1">
<tr>
<td width="33%"> </td>
<td width="34%"> </td>
<td width="33%"> </td>
</tr>
<tr>
<td width="33%"> </td>
<td width="34%"> </td>
<td width="33%"> </td>
</tr>
</table>
테이블로 만든다면 위와같이 될텐데,
이것을 div 로 만든다면 어떻게 코딩을 해야 하나요?
한줄에 박스 하나밖에 못넣던데.. 어떻게 해야 두개, 세개를 넣을 수 있지요?
그리고, <ul> <li> <ol> 등과 같은것도 연관이 있나요?
아 어려워용. ㅠ.ㅠ
너무 초보적인거 묻는다구 혼내지 마세용. ㅠ.ㅠ
div 에 대한 참고할만한 사이트나 강좌좀 소개 부탁드릴께요.
댓글 2
-
xe촙5
2007.11.09 12:28
-
Bok-e
2007.11.30 16:20
123456
<DIV style="FLOAT: left; WIDTH: 30px;">1</DIV> <DIV style="FLOAT: left; WIDTH: 30px;">2</DIV> <DIV style="WIDTH: 30px;">3</DIV> <DIV style="FLOAT: left; WIDTH: 30px;">4</DIV> <DIV style="FLOAT: left; WIDTH: 30px;">5</DIV> <DIV style="WIDTH: 30px;">6</DIV>
이런걸 찾으시는건가요..ㅎ
css 로 옮겨가는게 깔끔하겠네요~
float: left; 속성이 왼쪽으로 붙인다는 말입니다..
실습해보면 금방 아실걸요 ^^
div를 가로로 3개 배치한다는 것이 보통일이 아니죠. ㅋ
스타일시트를 써서 float:left; 이런걸 써야하지 않나요?
예를 들어서
<div style="border:1px solid #000000;">
<div style="float:left; border:1px solid #000000;">첫번째</div>
<div style="float:left; border:1px solid #000000;">두번째</div>
<div style="float:left; border:1px solid #000000;">세번째</div>
</div>
<div style="clear:left; border:1px solid #000000;">
<div style="float:left; border:1px solid #000000;">첫번째</div>
<div style="float:left; border:1px solid #000000;">두번째</div>
<div style="float:left; border:1px solid #000000; width:300px;">세번째</div>
</div>
어째 좀 이상하네요 역시 난 촙5라서
맨마지막에 width를 100%로 해봤더니 다음줄로 가네요 ㅎㅎ
가로 사이즈는 px로 정확히 계산한 다음에 배분을 잘 해주어야 하겠는데요?
저같은 경우는 레이아웃 만들때 좌측 메뉴박스는 200px로 했고요
우측 공간은 750px이나 그렇게 주고 중간 공간은 50예상하고
그렇게 해서 보더 1px씩 차지하고 나면 가로는 얼추 1000px내에 다 들어옵니다.
제로보드도 대략 1000px에 마췄다고 보여지네요
<div style="clear:both; border:1px solid #000000; width:600px;height:200px;background:#99ffcc;">
<div style="float:left; border:1px solid #000000;width:200px;">좌측메뉴</div>
<div style="float:right; border:1px solid #000000;width:300px;">본문</div>
</div>
대략 이렇게 했습니다.