[HTML] table만드는 방법

[HTML] table만드는 방법

<style type="text/css">

.tg {

border-collapse: collapse; /*셀들간의 공백을 가질지 안 가질지를 결정*/

border-spacing: 0; /*separate 일때문 유효함*/

}

.tg td {

font-family: Arial, sans-serif;
/*Arial글꼴을 먼저 찾고 없으면 웹브라우저에서 설정한 명조 계열 글꼴을 찾음
영어는 Arial이 있고 한글은 없으면 한글은 웹브라우저에서 설정한 명조 계열 글꼴*/

font-size: 14px; /*글자 크기를 지정 14px이처럼 구체적지정말고 smaller larger등등도 가능*/

padding: 10px 5px; /*테이블 내의 여백*/

border-style: solid; /*말그대로 테이블 외각 border style*/

border-width: 1px; /*선 두께*/

overflow: hidden; /*내용이 요소의 크기를 넘어갔을 때 어떻게 처리 할 것인지?*/

word-break: normal; /*띄어쓰기가 없는 긴 단어를 어떻게 처리 할 것인지?*/

border-color: black;

}

.tg th {

font-family: Arial, sans-serif;

font-size: 14px;

font-weight: normal;

padding: 10px 5px;

border-style: solid;

border-width: 1px;

overflow: hidden;

word-break: normal;

border-color: black;

}

.tg .tg-baqh {

text-align: center;

vertical-align: top

}

.tg .tg-0lax {

text-align: left;

vertical-align: top

}

</style>

<table class="tg">

<tr>

<th class="tg-baqh">매개변수</th>

<th class="tg-0lax">값</th>

</tr>

<tr>

<td class="tg-0lax">self</td>

<td class="tg-0lax">생성되는 객체</td>

</tr>

<tr>

<td class="tg-0lax">first</td>

<td class="tg-0lax">4</td>

</tr>

<tr>

<td class="tg-0lax">second</td>

<td class="tg-0lax">2</td>

</tr>

</table>

http://www.tablesgenerator.com/html_tables# 여기를 참고하면 쉽게 만들수 있음