2,3번에 들어가는 CSS파일 :
멜론 zip:
1.
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style type="text/css">
table{
width: 100%;
border-collapse: collapse; /* 테두리를 1개로 */
}
table, th, td{
border: 1px solid black;
}
th {
height: 50px;
text-align: left;
background-color: green;
color: white;
border-width: 5px;
}
td{
padding: 15px;/* 안쪽여백 */
}
</style>
</head>
<body>
<table>
<tr>
<th>번호</th><th>이름</th><th>나이</th>
</tr>
<tr>
<th>1</th><td>홍길동</td><td>24</td>
</tr>
<tr>
<th>2</th><td>성춘향</td><td>16</td>
</tr>
<tr>
<th>3</th><td>일지매</td><td>21</td>
</tr>
</table>
</body>
2.
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="css/import.css">
</head>
<body>
<div id="wrap">
<div class="inner">
<div class="tbl_type_01">
<table>
<caption>테이블 타입1</caption>
<colgroup>
<col style="width: 120"/>
<col />
</colgroup>
<tbody>
<tr>
<th scope="row">제목</th>
<td><input type="text" class="txt"></td>
</tr>
<tr>
<th scope="row">비번</th>
<td><input type="password" class="txt w200"></td>
</tr>
<tr>
<th scope="row">파일</th>
<td><input type="file" class="txt"></td><!-- 자료실에 file씀 -->
</tr>
<tr>
<th scope="row">내용</th>
<td>
<div class="textarea_grp">
<textarea></textarea>
</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</body>
3.
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" type="text/css" href="css/import.css">
</head>
<body>
<div id="wrap">
<div class="inner">
<div class="tbl_type_02">
<table>
<caption>테이블 타입2</caption>
<colgroup>
<col style="width: 8%" />
<col /><!-- 제목은 길어서 길이 안잡아줌 -->
<col style="width: 10%" />
<col style="width: 10%" />
<col style="width: 10%" />
</colgroup>
<thead>
<tr>
<th scope="col">번호</th>
<th scope="col">제복</th>
<th scope="col">작성자</th>
<th scope="col">조회수</th>
<th scope="col">작성일</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td class="subject">
<a href="#none">제목입니다</a>
</td>
<td>id명ㅎ</td>
<td>5</td>
<td>2020-11-06</td>
</tr>
<tr>
<td>2</td>
<td class="subject">
<a href="#none">
<span class="reply_icon">답변 : </span>
답변입니다.
</a>
</td>
<td>일지매</td>
<td>3</td>
<td>2020-11-16</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</body>
'CSS' 카테고리의 다른 글
| font// 폰트 정리 (0) | 2020.07.14 |
|---|---|
| CSS파일// js파일과 html호출하여 테이블 셋팅하기 (0) | 2020.07.13 |
| CSS div 다루기 (0) | 2020.07.13 |
| 단어 여백설정, 정렬 (0) | 2020.07.13 |
| CSS 폰트 다루기 (0) | 2020.07.13 |
