=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-= html -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>무제 문서</title>
<link href="test.css" type="text/css" rel="stylesheet"/>
</head>
<body>
<h3>테이블 꾸미기 XHTML</h3>
<table width="700" cellpadding="0" cellspacing="0" border="1" id="t1">
<tr><th class="t11">이름</td><td></td></tr>
<tr><th class="t11">전공</td><td></td></tr>
<tr><th>연락처</th><td></td></tr>
</table>
<p></p>
<h3>테이블 꾸미기</h3>
<table cellspacing="0" cellpadding="0" border="1" id="t3" title="그룹핑테이블">
<thead>
<tr><td></td><td></td><td></td></tr>
</thead>
<tbody>
<tr><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td></tr>
</tbody>
</table>
<h3>테이블 꾸미기 XHTML</h3>
<table cellspacing="0" cellpadding="0" border="1" id="t4" title="그룹핑테이블">
<colgroup id="back1">
<colgroup id="back2">
<colgroup id="back3">
<thead>
<tr><td></td><td></td><td></td></tr>
</thead>
<tbody>
<tr><td></td><td></td><td></td></tr>
<tr><td></td><td></td><td></td></tr>
</tbody>
</table>
</body>
</html>
</body>
</html>
===============================================CSS==========================================
@charset "utf-8";
/* CSS Document */
#t1, #t1 tr, #t1 td{border:1px solid #000; border-collapse:collapse;
border-left-style:none; border-rigth-style:none;}
#t1{border-top:2px solid #000; border-bottom:2px solid #000;}
#t1 td {background:#cf8;}
#t1 th {background:#ff9900;
width:30%; height:40px; font-size:13px;
text-align:left; padding-left:30px;}
#t1 .t11{background:#6600FF no-repeat 10px 50%;}
#t3, #t3 tr, #t3 td {border:1px solid#000; border-collapse:collapse;}
#t3 thead{background:#ffff00;}
#t3 thead tr td{width:200px; height:30px;}
#t3 tbody{background:#ffffcc;}
#t3 tbody tr td {width:200px; height:50px;}
#t4, #t4 tr, #t4 td {border:1px solid #000; border-collapse:collapse;}
#t4 #back1{background:#FF00FF; width:200px;}
#t4 #back2{background:#FF66FF; width:200px;}
#t4 #back3{background:#FFCCFF; width:200px;}
#t4 thead tr td{height:30px;}
#t4 tbody tr td{height:50px;}
'xhtml' 카테고리의 다른 글
| img 태그에 width와 height 속성이 필요한 이유 (0) | 2012.01.16 |
|---|---|
| div 태그로 짠 테이블 (0) | 2011.07.14 |
| 웹 표준 코딩 (0) | 2011.07.14 |
