WEB/CSS

[CSS] ch04-19. tb

밍글링글링 2017. 8. 28.
728x90

19_tb.html

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>요안도라</title>

<style>
    @import "../css/19_tb.css";
</style>
</head>

<body>
<h3>table layout</h3>
<table id="tb1">
    <tr>
        <th>CONSTRAINT_VALIDATION</th>
        <td>table layout을 이용한 셀 너비 조절</td>
    </tr>
</table>
</body>
</html>
 

19_tb.css

@CHARSET "UTF-8";
#tb1{
    width: 300px;/*테이블 크기 가로*/
    table-layout: fixed;/*fixed: 셀 너비 고정, auto: 셀 너비 자동 조정(기본값)*/
    word-break: break-all;/*단어를 너비에 맞춰서 쪼개기*/
    height:auto;/*테이블 크기 세로*/
    /*위치를 나타내는 값은 position// left top*/
}
th,td{
    border: 1px solid black;
    padding: 5px;
}
 

728x90

'WEB > CSS' 카테고리의 다른 글

[CSS] ch04-21. tb3  (0) 2017.08.28
[CSS] ch04-20. tb2  (0) 2017.08.28
[CSS] ch04-18. column  (0) 2017.08.28
[CSS] ch04-17. clear  (0) 2017.08.28
[CSS] ch04-16. float  (0) 2017.08.28

댓글