[CSS 강좌] 표(table) 과 배경색 꾸미기
배경색을 만드는 속성
배경색은 background-color 속성으로 만듭니다.
table, tr, th, td, thead, tbody, tfoot에 적용할 수 있습니다.
기본 모양
다음 표를 기본으로 하고, 배경색을 여러 곳에 추가해보겠습니다.
<!doctype html>
<html lang="ko">
<head>
<meta charset="utf-8">
<title>CSS</title>
<style>
table {
width: 100%;
border-top: 1px solid #444444;
border-collapse: collapse;
}
th, td {
border-bottom: 1px solid #444444;
padding: 10px;
text-align: center;
}
</style>
</head>
<body>
<table>
<thead>
<tr>
<th>성부</th><th>성자</th><th>성령</th><th>기독교의</th><th>근본사상</th>
</tr>
</thead>
<tbody>
<tr>
<th>성부</th><th>성자</th><th>성령</th><th>기독교의</th><th>근본사상</th>
</tr>
<tr>
<th>성부</th><th>성자</th><th>성령</th><th>기독교의</th><th>근본사상</th>
</tr>
<tr>
<th>성부</th><th>성자</th><th>성령</th><th>기독교의</th><th>근본사상</th>
</tr>
<tr>
<th>성부</th><th>성자</th><th>성령</th><th>기독교의</th><th>근본사상</th>
</tr>
<tr>
<th>성부</th><th>성자</th><th>성령</th><th>기독교의</th><th>근본사상</th>
</tr>
<tr>
<th>성부</th><th>성자</th><th>성령</th><th>기독교의</th><th>근본사상</th>
</tr>
<tr>
<th>성부</th><th>성자</th><th>성령</th><th>기독교의</th><th>근본사상</th>
</tr>
</tbody>
</table>
</body>
</html>
위 코드의 결과는
'홈페이지제작 > CSS' 카테고리의 다른 글
| [CSS 강좌] 워드프레스 테마 만들기 (0) | 2018.01.29 |
|---|---|
| [CSS 기초강좌] 표(table) 꾸미기 > 테두리 만들기 (0) | 2018.01.11 |
| [CSS 기초강좌 ] 아이디 선택자(ID Selector) (0) | 2018.01.09 |
| [CSS 기초강좌] 선택자 > 클래스 선택자(Class Selector) (0) | 2018.01.08 |
| [CSS 강좌 ]홈페이지의 글자 타입 선택자(Type Selector) (0) | 2018.01.05 |
itworldkorea
IT korea가 세상(world)을 변화시킨다.