.code { width: 100vw; height: 100vh; position: relative; } .code-back { position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .code-cont { width: 450rpx; position: absolute; z-index: 9; text-align: center; right: 0; bottom: 13%; } .code-img{ margin: 0 auto 20rpx; overflow: hidden; width: 220rpx; height: 220rpx; border: 4rpx solid #000; background-color: #ffffff; padding: 10rpx; box-sizing: border-box; } .code-img image { width: 100%; } .code-text { color: #000; font-size: 26rpx; font-weight: 600; } .code-share { position: absolute; z-index: 10; right: 0; bottom: 40%; background: linear-gradient(to right, #3f7fff, #568fff); width: 50rpx; text-align: center; border-radius: 26rpx 0 0 26rpx; padding: 24rpx 4rpx 24rpx 10rpx; box-shadow: 0 0 6rpx 6rpx rgba(0, 0, 0, .2); } .code-share-name { writing-mode:vertical-rl; font-size: 28rpx; padding-left: 4rpx; color: #fff; } .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; }