|
 |
 HTML 중급강좌
1. 표만들기(4)
|
 |
[1][2][3][4][5][6]
|
지금부터는 단순
암기보다는 약간의 이해가 필요로 하는 것을
배우보도록 하겠습니다. 바로 <td>명령어에
들어가는 속성에 대해서 알아보겠습니다.
| 속성 |
기능 |
| colspan="가로셀수" |
셀의 수만큼 가로
셀들을 하나로 병합해줍니다. |
| rowspan="세로셀수" |
셀의 수만큼 세로
셀들을 하나로 병합해줍니다. |
| nowarp |
브라우저 크기와 상관없이 테이블크기 고정 |
| width="수치" |
셀의 너비를
조정해줍니다. |
| align=left , center , right |
셀안에
수평정렬을 지정해줍니다. |
| valign=top , middle , bottom
, baseline |
셀안에
수직정렬을 지정해줍니다. |
위에 속성을 한번 쫘~악 읽어보니
뭔지 알겠남유? 이해는 되는 것 같기도 한데......역쉬...잘
모르겠지요.....그럼 또 다시 예제와 함께 이해를
팍팍 시켜드리겠습니다.^^
|
|
<table
border="1" width="250">
<tr>
<td colspan="2">A</td>
</tr>
<tr>
<td>B</td>
<td>C</td>
</td>
</table> |
위에 표는 colspan
속성을 사용하면 간단하게 만들 수 있습니다. colspan="가로셀수"
속성은 해당셀수만큼 가로행에 있는 셀들을 하나로
합해주는 기능을 합니다. 위에 표에서는 가로
두개의 셀을 하나로 합해준거죠.흠....간단하져?^^
그럼 좀 더 어려운 걸루 해볼까요? 아래표를 한번
봐보세요.
|
|
|
<table border="1"
width="250">
<tr>
<td>A</td>
<td>B</td>
</tr>
<tr>
<td colspan="2">C</td>
</tr>
<tr>
<td>D</td>
<td>E</td>
</tr>
</table>
|
<table border="1"
width="250">
<tr>
<td colspan="2" bgcolor="#C1BFC0">A</td>
<td>B</td>
<td>C</td>
</tr>
<tr>
<td>D</td>
<td colspan="2" bgcolor="#C1BFC0">E</td>
<td>F</td>
</tr>
<tr>
<td>G</td>
<td>H</td>
<td colspan="2" bgcolor="#C1BFC0">I</td>
</tr>
</table> |
이해가 되시는지.....^^
왼쪽에 <표1>은 이해 되져? 그러나
문제는 오른쪽에 있는 <표2>가 되겠네요^^ 원래 한
행마다 4개의 셀(칸)들이 있는걸 각 행에서 두개의
셀들을 합한거죠. 첫번째행에선 좌측두개의 셀을,
두번째행에선 중간두개의 셀을, 세번째행에선
우측두개의 셀을 합했죠. 어때요...쉽죠? ^^;;; 헉...모르겠다구요..--;;;
흠....더 이상은 설명하기가...........두뇌회전속도가
빠르신 분들은 금방 이해했을 텐데........그래도
모르시겠다면..............더 이상은 .....위에 소스를
보고 열심히 생각해보시면......트일 날(?)이 있을
겁니다.....머리로 안되면 노력이죠...뭐.....^^
하핫^^ colspan 속성 하나 설명하는데도 엄청난
지면을 차지하네요^^ 다음 페이지에서는 rowspan에
대해서 배워보도록 하죠.....^^
|
이전 페이지로 || 태그연습장 || 다음 페이지로
|
|
|
|
