*{ margin: 0; padding: 0; } html { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; /* 解决IOS默认滑动很卡的情况 */ -webkit-overflow-scrolling : touch; } body{ -webkit-tap-highlight-color: rgba(0, 0, 0, 0); font-size: .16rem; } /* 禁止缩放表单 */ input[type="submit"], input[type="reset"], input[type="button"], input { resize: none; border: none; } ol,li,ul,dl,dt,dd{ list-style:none; } img{ height: auto; object-fit: cover; } em, i { font-style: normal; } textarea { resize:none; } p { word-wrap:break-word; } a{ text-decoration: none; color: inherit; outline: none; -moz-outline-style: none; } a:active, a:focus { outline: none; } .textEllipsis{ text-overflow: ellipsis; white-space: nowrap; overflow: hidden; } /* <-- start 头部模块 */ .headerContainer{ width: 100%; height: 1.18rem; background-color: #FFF; } .warnContainer{ background-color: #FFF; width: 100%; height: .5rem; display: flex; align-items: center; justify-content: center; } .warnContainer .warnText{ max-width: 12rem; word-break: break-all; line-height: 1.4; font-weight: bold; font-size: .18rem; color: #000000; } .computerEndHeader{ border: 1px solid green; max-width: 12rem; margin: 0 auto; } /* end 头部模块 --> */ /* start 年龄提示模块 --> */ .maskContainer{ position: fixed; width: 100vw; height: 100vh; z-index: 999; top: 0; right: 0; bottom: 0; left: 0; background-color: rgba(0, 0, 0, .5); display: none; } .ageReminderBox{ width: 9rem; background-color: #FFF; height: 5rem; left: 50%; margin-left: -4.5rem; top: 30%; position: absolute; } .ageReminderBack{ position: absolute; z-index: 1; height: 100%; width: 100%; top: 0; left: 0; } .ageReminderInfo{ position: relative; z-index: 2; margin-left: .32rem; padding-top: 1rem; color: #fff; } .ageReminderInfo h3{ line-height: 1.4; font-size: .5rem; max-width: 60%; font-weight: bold; } .ageReminderInfo .ageReminderButBox{ display: flex; align-items: center; padding-top: .32rem; } .ageReminderInfo .ageReminderButBox .ageRBut{ color: rgba(237, 109, 244, 1); background-color: #fff; display: flex; align-items: center; justify-content: center; height: .6rem; border-radius: .08rem; font-size: .28rem; font-weight: bold; min-width: 1.8rem; padding: 0 .24rem; margin-right: .32rem; cursor: pointer; } /* end 年龄提示模块 --> */ /* <-- start 底部模块 */ .footerContainer{ width: 100%; height: 1.34rem; background-color: rgba(32, 32, 32, 1); } .footerConter{ color: #FFF; padding-top: .24rem; display: flex; } .leftText{ max-width: 2rem; margin-right: .8rem; } .leftText .ltK{ font-weight: bold; font-size: .18rem; word-break: break-all; padding-bottom: .06rem; } .leftText .ltV{ font-size: .14rem; color: rgba(255, 255, 255, .6); word-break: break-all; } .footerInuptBox{ background: #FFF; flex: 1; height: .5rem; display: flex; justify-content: space-between; align-items: center; padding: 0 .24rem; max-width: 5rem; margin-right: 1.5rem; } .footerInuptBox .mailIcon{ width: .28rem; height: .28rem; } .footerInupt{ flex: 1; height: 100%; outline: none; font-size: .18rem; margin: 0 .12rem; } .footerInuptBox .arrowIcon{ width: .28rem; height: .28rem; } .footerIconContainer{ max-width: 4rem; } .footerIconList{ overflow-x: scroll; white-space: nowrap; } .footerIconList::-webkit-scrollbar { display: none; } .footerIconItem{ margin-right: .12rem; display: inline-flex; } .footerIconItem img{ width: .4rem; height: .4rem; border-radius: 50%; } .footerVlsaImg{ font-size: 0; } .footerVlsaImg img{ height: .3rem; width: auto; } /* end 底部模块 --> */ @media (max-width: 1199px) { .warnContainer{ height: auto; } .warnContainer .warnText{ font-size: .22rem; padding: .06rem .24rem; } .footerContainer{ height: auto; } .footerConter{ display: block; padding: .24rem .12rem; } .leftText{ max-width: none; margin-right: 0; margin-bottom: .32rem; } .leftText .ltK{ font-size: .2rem; } .leftText .ltV{ font-size: .18rem; } .footerInuptBox{ max-width: 6rem; margin-right: 0; height: .6rem; margin-bottom: .32rem; } .footerIconContainer{ max-width: none; } .footerIconList{ white-space: normal; overflow-x: hidden; display: flex; flex-wrap: wrap; margin-bottom: .12rem; } .footerIconItem{ display: block; margin-right: .24rem; } } @media (max-width: 899px) { .warnContainer .warnText{ font-size: .24rem; } .ageReminderBox{ width: 7rem; margin-left: -3.5rem; height: 3.5rem; } .ageReminderInfo{ padding-top: .6rem; } .ageReminderInfo h3{ font-size: .4rem; } .ageReminderInfo .ageReminderButBox .ageRBut{ font-size: .24rem; min-width: 1.4rem; } .leftText .ltK{ font-size: .22rem; } .leftText .ltV{ font-size: .2rem; } .footerIconItem img{ width: .5rem; height: .5rem; } .footerVlsaImg img{ height: .4rem; } }