.mask { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); /*黑色半透明背景*/ z-index: 999999998; } .weui-half-screen-dialog { position: fixed; width: 80%; /* top 坐标居中 */ top: 50%; /* left 坐标居中 */ left: 50%; /* 由于元素的高度是100px 所以此处设置为-50px以达到整个元素上移自己高度的一半,达到垂直居中 */ margin-top: -50%; /* 由于元素的高度是100px 所以此处设置为-50px以达到整个元素左移自己宽度的一半,达到水平居中 */ margin-left: -39%; min-height: 510rpx; max-height: 55%; z-index: 999999999; line-height: 1.4; background-color: #fff; color: hsla(0, 0%, 100%, 0.8); border-radius: 24rpx; overflow: hidden; padding: 0 48rpx; /* padding: 0 calc(48rpx + constant(safe-area-inset-right)) constant(safe-area-inset-bottom) calc(48rpx + constant(safe-area-inset-left)); padding: 0 calc(48rpx + env(safe-area-inset-right)) env(safe-area-inset-bottom) calc(48rpx + env(safe-area-inset-left)); */ box-sizing: border-box; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; flex-direction: column; outline: 0; } .weui-half-screen-dialog__hd { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-flex-shrink: 0; flex-shrink: 0; justify-content: center; } .weui-half-screen-dialog__title { display: block; color: #000; font-weight: 600; font-size: 40rpx; padding: 40rpx 0 20rpx; } .weui-half-screen-dialog__bd { min-height: 0; overflow-y: auto; word-wrap: break-word; -webkit-hyphens: auto; hyphens: auto; padding-bottom: 100rpx; font-size: 28rpx; color: hsla(0, 0%, 100%, 0.8); } .weui-half-screen-dialog__tips { padding-top: 32rpx; font-size: 28rpx; color: #000; line-height: 1.4; } .weui-half-screen-dialog__ft { /* padding: 0 0 128rpx; */ text-align: center; } .weui-half-screen-dialog__btn-area .weui-btn:nth-last-child(n + 2)+.weui-btn:first-child, .weui-half-screen-dialog__btn-area .weui-btn:nth-last-child(n + 2):first-child { margin-left: 0; } .disagreeBtn { color: #c1c1c1; margin-top: 20rpx; font-size: 28rpx; } .weui-half-screen-dialog__btn-area .weui-btn:nth-last-child(n + 2), .weui-half-screen-dialog__btn-area .weui-btn:nth-last-child(n + 2)+.weui-btn { margin: 0 16rpx; } .weui-half-screen-dialog__ft .weui-btn:nth-last-child(n + 2), .weui-half-screen-dialog__ft .weui-btn:nth-last-child(n + 2)+.weui-btn { display: inline-block; vertical-align: top; margin: 0 16rpx; } .weui-half-screen-dialog__btn-area .weui-btn { padding-left: 32rpx; padding-right: 32rpx; } button.weui-btn, input.weui-btn { border-width: 0; outline: 0; -webkit-appearance: none; } .weui-btn { position: relative; display: block; width: 100%; margin-left: auto; margin-right: auto; padding: 16rpx 48rpx; box-sizing: border-box; font-weight: 500; font-size: 28rpx; text-align: center; text-decoration: none; color: #000!important; line-height: 1.88235294; border-radius: 16rpx; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); -webkit-user-select: none; user-select: none; background-color: var(--subtitleColor)!important; }