效果图:
html文件:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>图文显示商品</title>
</head>
<body>
<div style="padding-bottom: 10px;">
<span style="padding-left: 20px;">已付款</span><span style="padding: 300px;">付款方式:微信支付</span>
</div>
<div>
<hr style="width: 700px;margin-left: 0px;">
</div>
<div >
<div style="float: left;">
[外链图片转存失败(img-WsbFjtHC-1562071685050)(https://mp.csdn.net/mdeditor/images/070201.jpg)]
</div>
<div style="float:left">
<p style="line-height: 1px;padding-left: 15px;">杂纸张A级</p>
<p style="padding-left: 15px;">单价:12.2元</p>
<p style="padding-left: 15px;line-height: 1px;">24kg</p>
</div>
<div style="float: left;padding-top: 30px;padding-left: 20px;">
<label>1000元</label>
</div>
<div style="float: left;padding-left: 100px;">
[外链图片转存失败(img-bL0uUBFK-1562071685051)(https://mp.csdn.net/mdeditor/images/070202.jpg)]
</div>
<div style="float:left">
<p style="line-height: 1px;padding-left: 15px;">黄纸张A级</p>
<p style="padding-left: 15px;">单价:2.2元</p>
<p style="padding-left: 15px;line-height: 1px;">14kg</p>
</div>
<div style="float: left;padding-top: 5px;padding-left: 20px;">
<label>1000元</label>
</div>
</div>
<div>
<hr style="width: 700px;margin-left: 0px;margin-top: 130px;">
</div>
<div style="padding-top:0px;padding-left: 500px;">
<p>总计:2000元</p>
</div>
</body>
</html>