温馨提示
@@ -284,10 +313,10 @@
// 使用 html2canvas 将区域内容生成为图片
console.log('html2canvas', window.devicePixelRatio)
- let sca = 0.8
- if (window.devicePixelRatio >= 1) {
- sca = 0.7
- }
+ let sca = 0.38
+ // if (window.devicePixelRatio >= 1) {
+ // sca = 0.7
+ // }
const canvas = await html2canvas(captureArea, { scale: sca })
// 将 canvas 转为图片 URL
@@ -867,6 +896,88 @@
}
}
}
+ .dyImg {
+ position: fixed;
+ top: 100%;
+ left: 100%;
+ margin: 0;
+ width: 40rem;
+ height: 70.8rem;
+ display: flex;
+ flex-direction: column;
+ justify-content: space-around;
+ align-items: flex-end;
+ .card-box2 {
+ position: relative;
+ font-family: 'OCR';
+ margin: 0 auto;
+ img {
+ width: 100%;
+ }
+ .diamond {
+ position: absolute;
+ top: 0;
+ right: 0;
+ height: 100%;
+ text-align: left;
+ left: 7.5rem;
+ font-size: 1.5rem;
+ .name {
+ font-family: 'STHeiti';
+ font-size: 28px;
+ margin: 50px 0 20px;
+ }
+ .gender {
+ div {
+ margin-left: 100px;
+ }
+ }
+ .birth {
+ margin: 24px 0 22px;
+ font-size: 26px;
+ span {
+ margin-right: 6px;
+ }
+ div {
+ margin-left: 18px;
+ width: 40px;
+ text-align: center;
+ }
+ }
+ .addr {
+ width: 280px;
+ line-height: 36px;
+ }
+ .idNum {
+ position: absolute;
+ font-family: 'STHeiti';
+ font-weight: 500;
+ left: 92px;
+ font-size: 32px;
+ letter-spacing: 2px;
+ bottom: 46px;
+ }
+ .avatar {
+ position: absolute;
+ right: 40px;
+ width: 192px;
+ top: 60px;
+ }
+ }
+ .diamond2 {
+ height: auto;
+ top: auto;
+ left: 260px;
+ bottom: 36px;
+ font-size: 28px;
+ font-weight: 400;
+ font-family: 'STHeiti';
+ .sign {
+ margin-bottom: 25px;
+ }
+ }
+ }
+ }
}
.file3 {
margin-right: 28.13rem;