*전체 배경 및 글자색 지정하기 - <bgcolor>, <text>
//<body bgcolor="색깔" text="색깔">
//글꼴 모양을 "바탕", 사이즈 5 지정. 배경색="노랑" 글꼴="빨강"
<html>
<head>
<title>Welcome to KKC World~!</title>
</head>
<body bgcolor="yellow" text="red">
<font face="바탕" size="5">안녕하십니까?<br></font>
웹표준
java
</body>
</html>
*표 구성 상세설정
표의 크기 설정하기 - <width>, <height>
//<table border="3" width="300px" height="300px">
<html>
<head>
<title>Welcome to KKC World~!</title>
</head>
<body bgcolor="yellow" text="red">
<font face="바탕" size="5">안녕하십니까?<br>
<table border="3" width="300px" height="300px">
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
<tr>
<td>7</td>
<td>8</td>
<td>9</td>
</tr>
</table>
</body>
</html>
*표 병합하기
가로행 병합하기 - <colspan>
//<td>안에서 설정. <td colspan="2">
//4~5번 합치기: 5번 부분을 지워줘야 병합이 된다!
<table border="3" width="300px" height="300px">
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td colspan="2">4</td>
<td>5</td>
<td>6</td>
</tr>
<tr>
<td>7</td>
<td>8</td>
<td>9</td>
</tr>
</table>
세로행 병합하기 - <rowspan>
//<td>안에서 설정. <td rowspan="3">
//3,6,9 병합하기: 6,9번을 지워줘야 병합이 된다.
<table border="3" width="300px" height="300px">
<tr>
<td>1</td>
<td>2</td>
<td rowspan="3">3</td>
</tr>
<tr>
<td colspan="2">4</td>
</tr>
<tr>
<td colspan="2">7</td>
</tr>
</table>
*3번셀에 새로운 table 넣어보기
<html>
<head>
<title>Welcome to KKC World~!</title>
</head>
<body bgcolor="yellow" text="red">
<font face="바탕" size="5">안녕하십니까?<br>
<table border="3" width="600px" height="300px">
<tr>
<td>1</td>
<td>2</td>
<td rowspan="3">
//주황색 부분이 3번셀에 표가 들어간 것이다.
<table border="3" width="300px" height="300px">
<tr>
<td>1</td>
<td>2</td>
<td rowspan="3">3</td>
</tr>
<tr>
<td colspan="2">4</td>
</tr>
<tr>
<td colspan="2">7</td>
</tr>
</table>
</td>
</tr> //3번셀의 끝부분.
<tr>
//4번이나 7번부분에 테이블 행 길이를 맞춰줘야 함. 여기서는 7번에 적용.
<td colspan="2">4</td>
</tr>
<tr>
<td colspan="2" width="300px">7</td>
</tr>
</table>
</font>
</body>
</html>
*표의 크기를 웹사이트 창에 맞추기 - <width="100%">
//가장 큰 테이블에서 width설정을 100%로 맞춰주면 된다.
<html>
<head>
<title>Welcome to KKC World~!</title>
</head>
<body bgcolor="yellow" text="red">
<font face="바탕" size="5">안녕하십니까?<br>
<table border="3" width="100%" height="300px">
<tr>
<td>1</td>
<td>2</td>
<td rowspan="3">차근차근 그때그때 복습</td>
</tr>
<tr>
<td colspan="2">4</td>
</tr>
<tr>
<td colspan="2">7</td>
</tr>
</table>
</font>
</body>
</html>
3번 행만 고정시키기
//300px로 고정
<html>
<head>
<title>Welcome to KKC World~!</title>
</head>
<body bgcolor="yellow" text="red">
<font face="바탕" size="5">안녕하십니까?<br>
<table border="3" width="100%" height="300px">
<tr>
<td>1</td>
<td>2</td>
<td rowspan="3" width="100px">차근차근 그때그때 복습</td>
</tr>
<tr>
<td colspan="2">4</td>
</tr>
<tr>
<td colspan="2" width="300px">7</td>
</tr>
</table>
</font>
</body>
</html>
*가운데 정렬하기 - <align="center">
굵은체에 가운데정렬 - <th>
<html>
<head>
<title>Welcome to KKC World~!</title>
</head>
<body bgcolor="yellow" text="red">
<font face="바탕" size="5">안녕하십니까?<br>
<table border="3" width="50%" height="300px">
<tr>
<th width="30%">쉬운 html</th>
<th>2</th>
<th rowspan="3" width="100px">차근차근 그때그때 복습</th>
</tr>
<tr>
<td colspan="2" align="center"><font face="맑은 고딕" color="0000ff">아침에 일찍오기<br>몇시까지?</font></td>
</tr>
<tr>
<td colspan="2" width="300px">7</td>
</tr>
</table>
</font>
</body>
</html>
*하이퍼링크 생성하고 지정하기 - <a hrep="주소나 경로">
안녕하십니까? 쪽에 밑줄이 그어져있다.
이걸 클릭하면 이전에 작업했던 웹페이지로 넘어가도록 해놨다.
또한, 중앙정렬은 전에 배웠던 <p>를 이용했다. 위 그림처럼 전체가 중앙정렬이 된 것을 볼 수 있다.
<html>
<head>
<title>Welcome to KKC World~!</title>
</head>
<p align="center">
<body bgcolor="yellow" text="red">
<font face="바탕" size="5"><a href="01.html">안녕하십니까?</a></font><br>
<table border="3" width="50%" height="300px">
<tr>
<th width="30%">쉬운 html</th>
<th>2</th>
<th rowspan="3" width="100px">차근차근 그때그때 복습</th>
</tr>
<tr>
<td colspan="2" align="center"><font face="맑은 고딕" color="0000ff">아침에 일찍오기<br>몇시까지?</font></td>
</tr>
<tr>
<td colspan="2" width="300px">7</td>
</tr>
</table>
<font face="맑은 고딕" color="0000ff">웹표준<br>java<br>jsp</font>
</p>
</body>
</html>