#customers { margin: 0; padding: 0; padding: 1mm 0; width: 40mm; height: 50mm; text-align: center; box-sizing: border-box; } #customers tr{ display: block; height: 6mm; border: 1px solid #ccc; } td{ font-family: "黑体"; font-weight: "bold"; } .imgData{ display: block; }
骨架
<table id='customers'> <tr> <td> 日期: </td> <td> {item?.date} </td> </tr> <tr> <td> 制单: </td> <td> {item?.manufactureCode} </td> </tr> <tr> <td> 款号: </td> <td> {item?.style} </td> </tr> <tr> <td> 颜色: </td> <td> {item?.color} </td> </tr> <tr> <td> 床次: </td> <td> {item?.bedSeq} </td> </tr> <tr> <td> 尺码: </td> <td> {item?.size} </td> </tr> <tr> <td> 数量: </td> <td> {item?.total} </td> </tr> <tr> <td> <img className='imgData' src={`data:image/jpeg;base64,${item?.base64}`}></img> </td> </tr> </table>
运行结果