SOURCE

<div class="container">
	<div class="title-font title-bottom-gap">税务凭证</div>
	<div class="title-font">意大利风情餐厅</div>
	<div class="title-font">罗马大道123号</div>
	<div class="title-font">罗马，00185</div>
	<div class="title-font">税号：IT123456789</div>
	<div class="solid-border"></div>
	<table class="table-style">
		<tr>
			<th class="th-style">序号</th>
			<th class="th-style">商品/服务描述</th>
			<th class="th-style">数量</th>
			<th class="th-style">单价(元)</th>
			<th class="th-style">税额(元)</th>
			<th class="th-style">总价(元)</th>
		</tr>
		<tr v-for="(item, index) in taxInfo.list" :key="item.id">
			<td class="td-style">1</td>
			<td class="td-style">经典披萨</td>
			<td class="td-style">1</td>
			<td class="td-style">25.00</td>
			<td class="td-style">5.50</td>
			<td class="td-style">30.50</td>
		</tr>
	</table>
	<div class="dashed-border"></div>
	<div class="row-start-end title-font top-gap-1">
		<div>不含税总计</div>
		<div>82.00</div>
	</div>
	<div class="row-start-end title-font">
		<div>增值税(22%)</div>
		<div>18.22</div>
	</div>
	<div class="row-start-end title-font">
		<div>含税总计(应付金额)</div>
		<div>100.02</div>
	</div>
	<div class="dashed-border"></div>
	<div class="title-font top-gap-2">交易日期：2023-10-5</div>
	<div class="title-font">交易时间：21.00</div>
	<div class="title-font">收银员：张飞</div>

	<div class="title-font-2 title-top-gap">此凭证仅供商家内部税务申报使用，不直接作为顾客消费凭证。</div>
</div>

/* .container {
    padding: 10px;
    background: #fff;
  }

  .table-style {
    margin-top: 20px;
    width: 100%;
    border-collapse: collapse;
    border: 1px solid rgb(140 140 140);
    font-family: sans-serif;
    font-size: 12px;
    letter-spacing: 1px;
  }

  .th-style {
    border: 1px solid rgb(160 160 160);
    padding: 8px 10px;
  }

  .td-style {
    border: 1px solid rgb(160 160 160);
    padding: 8px 10px;
    text-align: center;
  }

  .row-start-end {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 8px;
  }

  .title-font {
    font-size: 14px;
  }

  .title-bottom-gap {
    margin-bottom: 10px;
  }

  .title-top-gap {
    margin-top: 10px;
  }

  .top-gap-1 {
    margin-top: 4px;
  }

  .top-gap-2 {
    margin-top: 8px;
  } */

.container {
    padding: 0.5mm;
    background: #fff;
}

.table-style {
    margin-top: 1mm;
    width: 100%;
    border-collapse: collapse;
    font-size: 2.8mm;
}

.th-style {
    padding: 1mm;
    text-align: left;
}

.td-style {
    padding: 1mm;
    text-align: left;
}

.solid-border {
    border-bottom: 0.1mm solid #000;
    height: 0.1mm;
    margin: 1mm 0;
    transform: scaleY(0.5);
}

.dashed-border {
    border-bottom: 0.1mm dashed #000;
    height: 0.1mm;
    margin: 1mm 0;
    transform: scaleY(0.5);
}

.row-start-end {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 2.11mm;
}

.title-font {
    font-size: 2.8mm;
}

.title-font-2 {
    font-size: 2.5mm;
}

.title-bottom-gap {
    margin-bottom: 1mm;
}

.title-top-gap {
    margin-top: 1mm;
}

.top-gap-1 {
    margin-top: 1mm;
}

.top-gap-2 {
    margin-top: 1mm;
}