[CSS] ch04-20. tb2

20_tb.html

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

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

<body>
  <table id="tb1">
    <caption> 주요 국가 통화율</caption>
    <tr>
      <th>통화명</th>
      <th>매매기준율</th>
      <th>전일대비</th>
      <th>등락률</th>
    </tr>
    <tr>
      <th>미국(USD)</th>
      <td>1,090,80</td>
      <td>1.20</td>
      <td>-0.11%</td>
    </tr>
    <tr>
      <th>일본(JPY 100)</th>
      <td>1,359.59</td>
      <td>5.58</td>
      <td>-0.41%</td>
    </tr>
    <tr>
      <th>중국(CNY)</th>
      <td>174.78</td>
      <td>0.30</td>
      <td>-0.17%</td>
    </tr>
  </table>
  <table id="tb2">
    <caption> 주요 국가 통화율</caption>
    <tr>
      <th>통화명</th>
      <th>매매기준율</th>
      <th>전일대비</th>
      <th>등락률</th>
    </tr>
    <tr>
      <th>미국(USD)</th>
      <td>1,090,80</td>
      <td>1.20</td>
      <td>-0.11%</td>
    </tr>
    <tr>
      <th>일본(JPY 100)</th>
      <td>1,359.59</td>
      <td>5.58</td>
      <td>-0.41%</td>
    </tr>
    <tr>
      <th>중국(CNY)</th>
      <td>174.78</td>
      <td>0.30</td>
      <td>-0.17%</td>
    </tr>
  </table>        
</body>
</html>

 

20_tb.css

@CHARSET "UTF-8";
#tb1{
    border:1px solid black;
    margin-bottom: 20px;
}
#tb2{
    border-collapse: collapse; /*테두리 합침*/
    border: 1px solid black;
}
th,td{
    border: 1px solid red;
}