<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style type="text/css" >
.left-box {
width: 1344px;
height: 880px;
background-color: skyblue;
float: left;
}
.right-box {
width: 360px;
height: 880px;
/* background-color: orange; */
float: right;
border: 0.5px solid #999;
}
div .qr-block {
margin: 20px;
}
div .qr-title {
font-family: '思源黑体';
font-size: 28px;
font-weight: 600;
line-height: 42px;
margin-bottom: 16px;
}
#icon {
width: 32px;
vertical-align: middle;
}
#qrcode {
width: 312px;
vertical-align: middle;
margin-bottom: 16px;
border: #256294 4px solid;
}
.font-botton {
width: 320px;
text-align: center;
margin-bottom: 16px;
color: #666;
}
input {
display: inline-block;
height: 38px;
width: 318px;
border-radius: 4px;
align-items: center;
font-size: 24px;
font-weight: 600;
}
#use-it {
background-color: #256294;
color: #fff;
border: #256294 1px solid;
}
#change {
background-color: #fff;
color: #256294;
border: #256294 1px solid;
margin-top: 8px;
}
</style>
<title>QRCode Qurey</title>
</head>
<body>
<div class="left-box">1</div>
<div class="right-box">
<div class="qr-block">
<div class="qr-title">
<img src="https://nasofcori.fun:9000/qrcode/qr/1470981902416.png" alt="" id="icon">
<span>FIT_110211</span>
</div>
<img src="https://nasofcori.fun:9000/qrcode/qr/1470981902416.png" alt="qrcode" id="qrcode">
<div class="font-botton">
<img src="#" alt="">
<span>Download Pic</span>
<span>丨</span>
<img src="#" alt="">
<span>Export CSV</span>
</div>
<input type="submit" value="USE IT" id="use-it">
<input type="submit" value="CHANGE" id="change">
</div>
</div>
</body>
</html>