* { padding: 0; margin: 0; } html, body { width: 100%; height: 100%; box-sizing: border-box; } .content { width: 100%; height: 100%; overflow-y: scroll; } .content::-webkit-scrollbar { width:0; } .question-container { width: 100%; position: relative; } .container-bg { width: 100%; display: block; } .title { position: absolute; top: 3.46rem; left: 50%; transform: translateX(-50%); width: 7.12rem; height: .54rem; } .title img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .subject { position: absolute; top: 3.7rem; left: 0; right: 0; margin:0 auto; width: 6.62rem; border-radius: 0 0 .2rem .2rem; } .question { position: relative; z-index: 2; width: 6.62rem; height: auto; border-radius: 0 0 .2rem .2rem; background: #fff; overflow: hidden; padding: 0 .4rem; box-sizing: border-box; } .inset { position: absolute; left: 0; top: 0; z-index: 99; width: 100%; height: .54rem; } .bottom { position: absolute; left: 0; bottom: -.18rem; width: 100%; height: .26rem; } .question-box { height: 9.72rem; overflow: hidden; border-radius: 0 0 .2rem .2rem; background: #fff; } .audio { position: absolute; top: .5rem; left: .3rem; display: flex; align-items: center; } .audio .audiobtn { width: .7rem; height: .7rem; margin-top: -10px; } .audio div { width: 85%; font-size: .32rem; } .question-photo { position: relative; width: 100%; margin-top: 1.7rem; height: 3.72rem; } .question-photo img { position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 100%; } .option { width: 100%; margin-top: .5rem; } .option li { width: 100%; height: .7rem; border: .02rem #FEA10F solid; margin-bottom: .3rem; font-size: .28rem; text-align: center; line-height: .7rem; border-radius: .16rem; list-style:none; } .select { background: #FEA10F; color: #fff; } .order { font-size: .28rem; text-align: center; padding-bottom: .3rem; } .ind { color: #7A81FF; } .popup { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, .8); z-index: 999; display: none; } .popup-content { width: 100%; height: 100%; } .popup-content .bg { margin-left: 17.5%; margin-top: 0.1rem; width: 65%; } canvas { position: absolute; top: -9999px; left: -9999px; } .baocun { margin-left: 26%; margin-top: 0rem; margin-bottom: 0.3rem; font-size: 0.3rem; color: gainsboro; } .code_all { position: absolute; left: 0; bottom: 0; width: 100%; display: flex; align-items: center; } .code_all img { width: 100%; } /*卷边效果 需要完善已经注释*/ /* box-shadow: 0 4px 8px 0 #A691D3; .question:before{ content: ''; position: absolute; right:0; bottom:0; border-style: solid; border-width: 0; border-color:#fff rgba(0, 0, 0, 0.2); transition: all .5s; border-radius: 0 0 50% 0; } .question:hover:before { border-top-width: 300px; border-right-width: 300px; } */