티스토리 뷰

FRONT-END/HTML

[HTML] 테이블 만들기

진심스테이크 2018. 4. 3. 14:21

 

 

 

 

- span style="color:색깔" : 폰트 색깔 변경

- rowspan="숫자" : 숫자 만큼의 칸을 하나로 만들어줌

<!DOCTYPE html>
<html>
<head>
    <title>table</title>
</head>
<body>
    <table width="400" height="250" border="1">
        <td colspan="3" bgcolor="lightblue" align="center">오늘의 수입/지출</td>
        <tr bgcolor="grey" align="center" span style="color:white">
            <td>내용</td>
            <td>수입</td>
            <td>지출</td>
        </tr>
        <tr>
            <td>월급!</td>
            <td>1,000,000</td>
            <td></td>
        </tr>
        <tr>
            <td>점심값</td>
            <td></td>
            <td>5,000</td>
        </tr>
        <tr>
            <td>부모님선물</td>
            <td></td>
            <td>30,000</td>
        </tr>
        <tr>
            <td rowspan="3" bgcolor="grey">총계</td>
            <td>수입</td>
            <td>지출</td>
        </tr>
        <tr>        
            <td>1,000,000</td>
            <td>35,000</td>
        </tr>
        <tr>
            <td>남은 돈</td>
            <td>965,000</td>
        </tr>
    </table>
</body>
</html>
저작자표시 비영리 변경금지

'FRONT-END > HTML' 카테고리의 다른 글

[HTML] SEMANTIC TAG  (0) 2019.01.21
[HTML] FORM  (0) 2019.01.16
[HTML] TAGS  (0) 2019.01.16
[HTML] 회원가입 양식 만들기  (0) 2018.04.04
[HTML] BASIC THINGS  (0) 2018.04.03
댓글