유형4 (temp_tb_type4)

  • CSS Code

    .temp_tb_type4{width:100%; border-top:2px solid #616161;}
    .temp_tb_type4 caption{display:none;}
    .temp_tb_type4 th{padding:5px 0; border-right:1px solid #E4E4E4; border-bottom:1px solid #E4E4E4;}
    .temp_tb_type4 th.no_rightline, td.no_rightline{border-right:0px !important;}
    .temp_tb_type4 td{padding:5px 5px 5px 10px;; border-right:1px solid #E4E4E4; border-bottom:1px solid #E4E4E4;}
  • HTML Code

    <table class="temp_tb_type4" summary="">
    <caption>항목 목록</caption>
    <colgroup>
    <col width="15%"/>
    <col width="35%"/>
    <col width="15%"/>
    <col width="35%"/>
    </colgroup>
    <tbody>
    <tr>
    <th>항목1</th>
    <td>내용</td>
    <th>항목2</th>
    <td class="no_rightline">내용</td>
    </tr>
    <tr>
    <th>항목3</th>
    <td>내용이 길 경우 내용이 길 경우 내용이 길 경우 내용이 길 경우 내용이 길 경우 내용이 길 경우 내용이 길 경우 </td>
    <th>항목4</th>
    <td class="no_rightline">내용</td>
    </tr>
    <tr>
    <th rowspan="2">항목5 (셀병합)</th>
    <td>내용</td>
    <th>항목6</th>
    <td class="no_rightline">내용</td>
    </tr>
    <tr>
    <td>내용</td>
    <th>항목7</th>
    <td class="no_rightline">내용</td>
    </tr>
    <tr>
    <th>항목8</th>
    <td>내용</td>
    <th>항목9</th>
    <td class="no_rightline">내용</td>
    </tr>
    <tr>
    <th>항목10</th>
    <td colspan="3" class="no_rightline">내용 (셀병합)</td>
    </tr>
    </tbody>
    </table>