Daily coding

CSS : 테이블 스타일 본문

Front-end/Client

CSS : 테이블 스타일

sunnnkim 2020. 1. 10. 14:41

 

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style type="text/css">
table {
	width: 100%;
	border-collapse: collapse;
}
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>
<!-- 테이블 CSS -->
<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>21</td>
</tr>
<tr>
	<th>3</th><td>성춘향</td><td>17</td>
</tr>
</table>

</body>
</html>

'Front-end > Client' 카테고리의 다른 글

CSS : header 헤더 / main 메인 / footer 푸터 태그  (0) 2020.01.10
CSS : 화면분할과 정렬(float)  (0) 2020.01.10
CSS : list 스타일과 list-style-image 설정  (0) 2020.01.09
CSS : Anchor 태그와 속성들  (0) 2020.01.09
CSS : Java Script에서 CSS적용하기  (0) 2020.01.09
'Front-end/Client' Related Articles more