HTML 표 만들기

lepamah(51)
Published in
#html
Words
97
Reading
1 min
Listen
Play
9y

강의 스크린에는 이미지가 떠있다.

그것과 비슷하게 태그(?)를 찾아가면서 입력해본다.

01.JPG

02.JPG

을 입력하면 저렇게 나온다.

03.JPG

04.JPG

이것의 경우도 마찬가지.

이제 보고 따라하다보니 슬슬 외워 지는 것 같기도 하다.

<body>
<table border="1" cellspacing="0" width="500" height="220">

<caption><h1>시간표</h1> </caption>

<tr align="center" style="color:blue" bgcolor="gray" >
  <td> </td> 
  <td width="90">월</td> 
  <td width="90">화</td> 
  <td width="90">수</td> 
  <td width="90">목</td> 
  <td width="90">금</td>  
</tr>


<tr align="center" >
<td>1</td> 
  <td>HTML</td> 
  <td>HTML</td> 
  <td>HTML</td> 
  <td>CSS</td> 
  <td>java</td> 
</tr>

<tr align="center">
  <td>2</td> 
  <td>파워포인트</td> 
  <td>CSS</td> 
  <td>체육</td> 
  <td>파워포인트</td> 
  <td>JSP</td> 
</tr>
</table>
<table border="2" cellspacing="0" cellpadding="10">

<caption><h1>Sitemap</h1></caption>

<tr align="center" bgcolor="cyan">
  <td>소개</td> 
  <td>영화</td> 
  <td>음악</td> 
</tr>

<tr valign="top"> 
  <td> <ul><li>주인장소개</li>  <li>가족소개</li>  <li>친구소개</li> <li>홈페이지소개</li>   </ul> </td> 
  <td> <ul><li>추억의영화</li>  <li>최근에본영화</li>  <li>영화포스터모음</li>               </ul> </td> 
  <td> <ul><li>음악감상실</li>  <li>The RealGroup</li>  <li>음악자료실</li>                  </ul> </td> 
</tr>

<tr align="center" bgcolor="cyan">
  <td>갤러리</td> 
  <td>게시판</td> 
  <td>동호회</td> 
</tr>


<tr valign="top"> 
  <td> <ul><li>장나라</li>  <li>소유진</li>  <li>김희선</li> <li>정우성</li> <li>장국영</li> <li>장동건</li>   </ul> </td> 
  <td> <ul><li>자유게시판</li>  <li>방명록</li>  <li>묻고답하기</li>               </ul> </td> 
  <td> <ul><li>우주애</li>  <li>산악회</li>  <li>춤바람</li>                       </ul> </td> 
</tr>
</table>
<table border="1" width="500" height="300">

<caption><h1>셀합치기</h1> </caption>

<tr> 
 <td rowspan="3" valign="top" bgcolor="skyblue">★</td> 
 <td colspan="3" bgcolor="pink">★</td>
</tr>

<tr> 
 <td colspan="2" bgcolor="pink">★</td> 
 <td rowspan="3" valign="bottom" bgcolor="skyblue">★</td>
</tr>

<tr> 
 <td >★</td> <td>★</td>
</tr>

<tr> 
 <td colspan="3" bgcolor="pink">★</td>
</tr>

</table>
<table border="0" width="500" height="300">

<caption><h1>셀합치기</h1> </caption>

<tr bgcolor="orange">
<td colspan="2" height="20"><font size="6"><b>Main Tile of Web Page</b></font></td>
</tr>

<tr valign="top">
<td bgcolor="yellow">
        <b>Menu</b><br> 
        HTML<br> 
        CSS<br> 
        JavaScript</td> 
    <td>Content goes here </td>
</tr>

<tr bgcolor="orange" align="middle">
<td colspan="2" height="20">Copyright 2013 Lust.com</td>
</tr>

</table>

</body>

HTML 표 만들기 | Ecency