2023年8月28日 星期一

V120401F HTML : Table rowspan colspan - V60202Q

 目的: V120401F   <HTML>  Table  rowspan 的用法  - 列印標籤

處理說明:  1> rowspan用法:
                        <tr> 
                            <td>1</td>
                            <td rowspan="2">2</td>
                            <td rowspan="3">3</td>
                            <td rowspan="4">4</td>
                            <td rowspan="5">5</td> 
                       </tr>


1>*.js

HTML碼如下。

<table>
    <tbody>
        <tr>
            <td>1</td><td rowspan="2">2</td><td rowspan="3">3</td><td rowspan="4">4</td><td rowspan="5">5</td>
        </tr>
        <tr>
            <td>6</td>
        </tr>
        <tr>
            <td>11</td><td>12</td>
        </tr>
        <tr>
            <td>16</td><td>17</td><td>18</td>
        </tr>
        <tr>
            <td>21</td><td>22</td><td>23</td><td>24</td>
        </tr>
    </tbody>
</table>


2>colspan用法

   <td colspan="2">領用件號:M27500-16PS2S23</td>




Ex: V60202Q.js

<!DOCTYPE html>
<html>
<title>Online HTML Editor</title>
<head>
</head>
<body>
<div id='print_area' style='width:10cm;height:4cm;border:1px solid yellow;font-size:8pt;'>
<div id='div_data'>
<table id='tbl_11' style='width:100%;height: 15%;' border=1px solid black;' cellspacing=0>   "
<tr>
<td>機號:A035</td>
<td>工號:22887450</td>
<td>工單件號:AE8-81-74602</td>
</tr>
</table> <!-- end of table id='tbl_11' -->
<table id='tbl_12' style='width:100%;height: 85%;' border=1px solid black;' cellspacing=0>   "
<tr>
<td colspan="2">領用件號:M27500-16PS2S23</td>
</tr>
<tr>
<td colspan="2">件號.條碼</td>
</tr>
<tr>
<td style='width:50%;'>領料數量:1</td>
<td style='width:50%;'>單位:EA</td>
</tr>
<tr>
<td colspan="2">名稱:保險絲</td>
</tr>
<tr>
<td style='width:50%;'>庫房:17#</td>
<td style='width:50%;'>儲位:F17</td>
</tr>
<tr>
<td style='width:50%;'>領料人員: 611292 蔡聰進 856</td>
<td style='width:50%;'>2026/10/02 08:30</td>
</tr>
</table> <!-- end of table id='my_tbl_12' -->
</div> <!-- end of <div id='div_data' -->
<div class='display' id='break_page1' style='break-after:page'>
</div>
</div> <!-- end of <div id='print_area' -->
</body>
</html>


沒有留言:

張貼留言