반응형
HTML 테이블 선 하나로 만드는 법
https://youknow301.tistory.com/m/78
코드를 짜다보면 테이블의 선이 위의 사진처럼 이중으로 되는것을 확인할 수 있다.
위의 사진 처럼 만들기위해서는
border-collapse: collpase를 사용하면 된다.
위에 대한 예제코드는 다음과 같다.
<!DOCTYPE html>
<html>
<style>
table,th,tr,td{
border:2px solid red;
width:1000px;
border-collapse: collapse;
}
</style>
<body>
<table>
<tr>
<th>PERSON 1</th>
<th>PERSON 2</th>
<th>PERSON 3</th>
</tr>
<tr>
<td>KOREA</td>
<td>JAPAN</td>
<td>CHINA</td>
</tr>
<tr>
<td>50,000,000</td>
<td>120,000,000</td>
<td>1,500,000,000</td>
</tr>
</table>
</body>
</html>반응형
'웹프로그래밍 > HTML' 카테고리의 다른 글
| HTML Form Elements (0) | 2023.09.07 |
|---|---|
| HTML Form 속성 (0) | 2023.09.07 |
| HTML 텍스트 포멧팅(TEXT Formattiong) <b>, <strong>, <i>, <em>, <mark>, <small>, <del>, <ins>, <sub>, <sup> 사용법 (0) | 2023.09.05 |
| HTML Forms (0) | 2023.09.05 |
| HTML Iframes (0) | 2023.09.04 |
댓글