.code { width: 100vw; height: 100vh; position: relative; } .code-back { position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .code-cont { width: 100%; position: absolute; z-index: 9; text-align: center; left: 0; bottom: 19%; } .code-img{ margin: 0 auto 20rpx; overflow: hidden; border-radius: 30rpx; width: 190rpx; height: 190rpx; border: 4rpx solid #be9768; background-color: #ffffff; } .code-img image { width: 100%; } .code-text { background: linear-gradient(to right, #aa957b, #ffeeda, #aa957b); -webkit-background-clip: text; background-clip: text; color: transparent; font-size: 26rpx; } .code-share { position: absolute; z-index: 10; left: 0; bottom: 24%; background: linear-gradient(to right, #aa957b, #ffeeda); width: 50rpx; text-align: center; border-radius: 0 20rpx 20rpx 0; padding: 20rpx 0; } .code-share-name { writing-mode:vertical-rl; font-size: 28rpx; padding-left: 4rpx; color: #4d2a00; } .code-share image { width: 30rpx; height: 30rpx; margin-bottom: 5rpx; } .sharePop { position: fixed; width: 100%; z-index: 99; left: 0; bottom: 0; background-color: #0a1930; display: none; } .sharePop.active { display: block; } .shareCont-label image { width: 60rpx; height: 60rpx; display: block; margin: 0 auto 10rpx; } .shareCancel { border-top: 2rpx solid #0e2c58; color: #ffffff; width: 100%; text-align: center; line-height: 100rpx; } .shareCont{ display: flex; padding: 30rpx 0; } .shareCont-label { color: #ffffff; flex: 2; text-align: center; font-size: 28rpx; } .codeShare-button { background-color: transparent; padding: 0; font-weight: normal; } /* canvas */ .canvasImg { position: absolute; left: -1000%; height: 800px; width: 375px; } /* 何院士样式 */ .newCode-cont { width: 70%; height: 200rpx; position: absolute; z-index: 9; text-align: center; left: 15%; bottom: 19.5%; background: linear-gradient(to top, #a09084, #a58367); padding: 15rpx; box-sizing: border-box; border-radius: 30rpx; } .newCode-img { height: 170rpx; margin: 0 auto; background: linear-gradient(to top, #e9d1bd, #c49b7a); border: 4rpx solid #f3c49d; border-radius: 30rpx; display: flex; padding: 10rpx 30rpx 10rpx 10rpx; box-sizing: border-box; } .newCode-img-title { width: calc(100% - 140rpx); } .newCode-img-title image { width: 80%; margin-top: 15rpx; } .newCode-img-code { width: 140rpx; height: 140rpx; }