* { padding: 0; margin: 0; } body { width: 100%; height: 100%; } .main { max-width: 800px; width: 100%; margin: auto; } #succ { width: 100%; height: 100%; background-color: #FFF; position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 20; display: none; } #succ .mainImg { width: 80%; display: block; margin: auto; } .main .payInfo { width: 100%; height: 230px; background-color: #3687FD; display: flex; flex-direction: column; align-items: center; color: #FFF; padding-top: 45px; box-sizing: border-box; } .main .ts { font-weight: normal; } .main #money { margin: 20px 0; font-size: 38px; } .main #orderNo { margin-top: 6px; } .main .payBtn { background-color: #0CBB07; width: 80%; height: 45px; text-align: center; line-height: 45px; border-radius: 6px; color: #FFF; margin: 100px auto 0; font-size: 18px; } #tip { position: fixed; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, .4); z-index: 10; display: none; } #tip .content { position: absolute; z-index: 15; background-color: #FFF; border-radius: 6px; width: 85%; top: 50%; left: 50%; transform: translate(-50%, -50%); } #tip .tipTitle{ padding: 20px; box-sizing: border-box; text-align: center; font-weight: bold; border-bottom: 1px solid rgb(236, 236, 236); } #tip .tipBt { padding: 12px; box-sizing: border-box; text-align: center; color: #2f6ecd; } .back { background-color: #0CBB07; width: 80%; height: 45px; text-align: center; line-height: 45px; border-radius: 6px; color: #FFF; margin: 60px auto 0; font-size: 18px; }