◈ 표 만들기◈ |
|
<TABLE></TABLE> |
테이블의 시작과 끝을 알리는 태그... 위치, 선의 두께, 색깔 등 많은 옵션을 줄 수 있습니다. |
<TR></TR> |
가로선-Table Row 의 약자 |
<TD></TD> |
세로선-Table Data 의 약자 |
<TH></TH> |
셀의 제목 |
<TABLE BORDER=300 CELLSPACING=300> |
테두리선 크기,셀과 셀 사이의 간격을 조정합니다. 표를 안보이게 하려면 <TABLE border=0> 이렇게 하시면 되겠져~ |
<TABLE CELLPADDING=300 BGCOLOR=blue> |
셀과 내부 글자와의 간격을 벌려줌, 바탕색을 지정합니다. |
<TABLE WIDTH=300 HEIGHT=300> |
Table 넓이와 높이 지정합니다. |
<TD COLSPAN=300 ROWSPAN=300> |
셀을 가로,세로로 합칩니다. |
<TD ALIGN=LEFT,CENTER,RIGHT VALIGN=TOP,MIDDLE,BOTTOM> |
좌우,중앙,상하 등으로 조정할 수 있습니다.(글자내용을) |
그러면...지금부터...여러 예제를 보여 드리겠습니다.
2줄 2칸(가로2세로2)표만들기 |
|||||||||
|
<TABLE
border> |
||||||||
표의 정렬 방식(align), 높이(height)와 넓이(width) 조절하기 | |||||||||
|
<TABLE border align="center"
height=100 width=200> |
||||||||
표의 테두리 선 조절하기 | |||||||||
표의 두께를 0으로 했을때 |
|||||||||
|
<TABLE border=0> |
||||||||
표의 두께를 10으로 했을때 |
|||||||||
|
<TABLE border=10> |
||||||||
표의 바탕색 조절하기 | |||||||||
표 전체에 색 넣기 |
|||||||||
|
<TABLE border bgcolor="red"> |
||||||||
표마다 다른색 넣기 |
|||||||||
|
<TABLE border> |
||||||||
표에 롤오버 효과내기(표에 마우스를 갖다대보세요~) |
|||||||||
|
<table border="1" width="205"> <tr> <td width="110" onMouseOver=this.style.backgroundColor="#ffcc00" onMouseOut=this.style.backgroundColor="">
<p align="center"> </p> </td> <td width="110" onMouseOver=this.style.backgroundColor="#ff6ec7" onMouseOut=this.style.backgroundColor="">
<p align="center"> </p> </td> <tr> <td width="110" onMouseOver=this.style.backgroundColor="#ffcc00" onMouseOut=this.style.backgroundColor="">
<p align="center"> </p> </td> <td width="110" onMouseOver=this.style.backgroundColor="#ff6ec7" onMouseOut=this.style.backgroundColor="">
<p align="center"> </p> </td> </table> |
||||||||
표에 스타일 효과내기 |
|||||||||
|
<table border="1" width="150"> |
||||||||
이와 같이 스타일 서식을 이용해서도 표를 꾸밀 수가 있는데요...
아마 많이 보셨을 겁니다...^^ 스타일 서식을 이용해서 저렇게 멋진 표도 만들 수 있는 것이져...스타일 시트 강좌에 보시면 스타일로는 아마 못하는게 없을겁니다...그러면 저 표 스타일의 여러 속성을 보도록 하지요. order-top-width:숫자 위와 같이 방향에 따라 표의 두께,색상,종류 등을 가지각색으로 만들 수 있습니다...참고로 나모 웹에디터에서는 표에서 오른쪽 버튼을 누르고 등록 정보를 누르시고 왼쪽 아래에 스타일 단추를 누르시면 스타일을 활용한 여러 표를 만들 수 있을 것입니다~ 그럼 멋진 표를 만드시길 바라면서.. |