$base-color: #3f84f6; html { overflow-y: scroll; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; font-size: 75px; } @media screen and (max-width: 750px){ html{ font-size: calc(100vw / 750 * 100); height: 100%; } ::-webkit-scrollbar { opacity: 0; display: none; } html * { outline:none; -webkit-text-size-adjust: none; -webkit-tap-highlight-color:rgba(0,0,0,0); -webkit-overflow-scrolling: touch; } /* 内外边距通常让各个浏览器样式的表现位置不同 */ body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td, hr, button, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { margin: 0; padding: 0; } input, select, textarea { font-size: 100%; } /* 去掉各 Table cell 的边距并让其边重合 */ table { border-collapse: collapse; border-spacing: 0; } /* 去除默认边框 */ fieldset, img { border: 0; } /* 去掉 firefox 下此元素的边框 */ abbr, acronym { border: 0; font-variant: normal; } /* 一致的 del 样式 */ del { text-decoration: line-through; } address, caption, cite, code, dfn, em, th, var { font-style: normal; font-weight: 500; } /* 去掉列表前的标识, li 会继承 */ ol, ul { list-style: none; } /* 对齐是排版最重要的因素, 别让什么都居中 */ caption, th { text-align: left; } q:before, q:after { content: ''; } /* 统一上标和下标 */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } /* 正常链接 未访问 */ a:link { } /* 鼠标悬停 */ a:hover { text-decoration: underline; } button { -webkit-appearance: none; -moz-appearance: none; appearance: none; outline: none; border: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; } /* 默认不显示下划线,保持页面简洁 */ ins, a { text-decoration: none; } .link-url { color: #01a44e; } input[type="text"], input[type="number"], input[type="tel"]{ -webkit-appearance: none; -moz-appearance: none; appearance: none; outline: none; -webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; border: none; } /*search*/ .search-content { padding-top: .15rem; input { width: 6.48rem; height: .58rem; line-height: .58rem; border-radius: .14rem; margin: 0 0 0 .11rem; font-size: .26rem; padding: 0 .71rem 0 .21rem; } span { display: inline-block; height: .58rem; line-height: .58rem; position: relative; top: .04rem; width: .68rem; color: #376ff3; border-left: .02rem solid #376ff3; margin-left: -.68rem; text-align: center; i { font-size: .31rem; } } img { width: .44rem; height: .44rem; float: right; margin-right: .2rem; margin-top: .1rem; } } } .say-price-btn { display: block; width: 6.7rem; height: .74rem; line-height: .74rem; text-align: center; color: #fff !important; background: #3f84f6; border-radius: .08rem; font-size: .32rem; margin: 0 auto; } /*报价info*/ .base-info { //width: 7.17rem; margin: 0 auto .18rem; background: #fff; padding: 0.1rem .29rem; .content-line { height: .46rem; line-height: .46rem; font-size: .28rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; span { color: #666; } } } /*登录弹窗*/ .mobile-modal { position: fixed; top: 0; bottom: 0; left: 0; right: 0; z-index: 999; background: rgba(0,0,0,.4); .mobile-modal-box { position: absolute; /*width: 5.92rem;*/ font-size: .28rem; top: 27%; left: 11%; right: 11%; z-index: 1000; .mobile-modal-header { line-height: .96rem; background: rgb(65,141,246); color: #fff; text-align: center; font-size: .32rem; position: relative; border-top-left-radius: .07rem; border-top-right-radius: .07em; i { position: absolute; right: -.25rem; font-size: .6rem; bottom: .46rem; } } .mobile-modal-content { background: #fff; color: #333; padding: 0 .54rem; border-bottom-left-radius: .07rem; border-bottom-right-radius: .07rem; div { padding: .2rem 0; line-height: .4rem; border-bottom: .04rem solid rgb(183,213,254); text-align: center; &:last-child { border-bottom: none; } /*&:first-child { text-align: left; }*/ } } &.mobile-link-en { top: 50%; margin-top: -2.14rem; } } .mobile-share-box { position: fixed; width: 100%; font-size: .28rem; bottom: 0; left: 0; z-index: 1000; background: #fff; color: #333; .cancel-share { height: .98rem; line-height: .98rem; font-size: .3rem; text-align: center; border-top: .04rem solid #cdcecf; } .share-area { .share-item { display: inline-block; width: 1.5rem; height: 1.52rem; padding-top: .3rem; i { margin: 0 auto; display: block; font-size: .55rem; width: .54rem; } span { display: block; text-align: center; margin-top: .1rem; } } } } } //.link-url { // color: #01a44e; //} //::-webkit-scrollbar { // opacity: 0; // display: none; //} // //input { // -webkit-appearance: none; // -moz-appearance: none; // appearance: none; // outline: none; // -webkit-box-shadow: none; // -moz-box-shadow: none; // box-shadow: none; // border: none; //} /*loading优先级*/ .loading { z-index: 100000 !important; } .mobile-content { padding-top: .88rem !important; margin-bottom: 1rem; } .mobile-content-long { padding-top: 1.26rem !important; } /*求购title*/ .seek-title { height: .96rem; line-height: .96rem; text-align: center; position: relative; border-bottom: .02rem solid rgb(219, 219, 219); background: #fff; > img { width: .36rem; height: .38rem; margin-right: .16rem; vertical-align: middle; margin-bottom: .16rem; } > span { font-size: .35rem; color: #666; } > a { position: absolute; right: .1rem; top: 0; font-size: .24rem; color: #999; margin-right: .1rem; img { width: .25rem; height: .25rem; margin-bottom: .04rem; } } } /*空状态*/ .com-none-state{ text-align: center; padding: 1.5rem .5rem .5rem .5rem; background: #fff; margin-top:.1rem; width:100%; word-break: break-all; img{ margin:0 auto; width: 4.08rem; height: 2.62rem; } p { font-size: .32rem; color: #999; margin-top: .3rem; } a { display: block; font-size: .28rem; color: #fff; width: 1.88rem; height: .54rem; line-height: .54rem; background: #418bf6; margin: .7rem auto 0; border-radius: .05rem; } } // 头部 .com-mobile-header { position: fixed; top: 0; z-index: 10; width:100%; height:.88rem; line-height: .88rem; background: #3e82f5; padding:0 .2rem 0 .1rem; color:#fff; > a { font-size:.28rem; color:#fff; position: absolute; i { font-size: .48rem; margin-right: -.1rem; } } p{ overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size:.36rem; text-align: center; margin: 0; width: 6rem; padding-left: 1rem; span { position: absolute; right: .4rem; font-size: .28rem; i { font-size: .28rem; } } } } .mobile-fix-content { position: fixed !important; top: .88rem; bottom: .98rem; width: 100%; background: #f1f3f6; overflow-y: auto; } .overflow-hidden { overflow: hidden !important; } /* 公共导航切换 */ .com-switch-item { text-align: center; background: #fff; .mobile-switch-btn { background: #fff; color: #666; display: inline-block; height: .64rem; font-size: .34rem; line-height: .64rem; width: 1.4rem; &:first-child { margin-right: 1.78rem; } &.active { color: #3f84f6; border-bottom: .04rem solid #3f84f6; } } } .mobile-center-header { height: 1.26rem; line-height: 1.26rem; p { line-height: normal; margin-top: .13rem; &.en-name { font-size: .3rem; margin-top: .06rem; img { height: .25rem; margin-top: -.06rem; margin-right: .05rem; } } } } .mobile-centerfix-content { top: 1.26rem; } $border-color: 1px solid #c5c5c5; table.com-price-list { table-layout: fixed; width: 3rem; margin: .19rem 0 .21rem .11rem; border: $border-color; font-size: .28rem; &.com-price-listLong { width: 5rem; } thead { tr th { background: #f3f3f3; border-bottom: $border-color; } } th, td { border-right: $border-color; text-align: center; height: .44rem; padding: 0 .1rem; &:last-child { border-right: none; } &.date { color: #e6353d; } } } /* 报价方式切换 */ .mobile-switch-say { text-align: center; font-size: 0; background: #fff; margin-bottom: .35rem; -webkit-box-shadow: 0 2px 4px #ccc; -moz-box-shadow: 0 2px 4px #ccc; box-shadow: 0 2px 4px #ccc; li { width: 50%; height: .72rem; line-height: .72rem; color: #666; font-size: .28rem; text-align: center; position: relative; &.active { color: #3f84f6; &::after { content: ''; position: absolute; width: 1.2rem; height: .07rem; background: #3f84f6; left: 50%; margin-left: -.6rem; top: .65rem; } } } } // 联系卖家 .com-mobile-link { float: right; font-size: .26rem; color: #3f84f6; margin-right: .12rem; width: 1.5rem; height: .56rem; text-align: center; line-height: .5rem; border: 1px solid #3f84f6; margin-top: .16rem; border-radius: .04rem; i { margin-right: .02rem; position: relative; top: .04rem; font-size: .34rem; } &:hover, &:active { color: #3f84f6; } } .mobile-cart-check { min-width: .36rem; height: .36rem; background: url('/images/mobile/center/user/car-noChecked.png') no-repeat; background-size: contain; &.active { background-image: url('/images/mobile/center/user/car-checked.png'); } vertical-align: middle; margin-bottom: .02rem; input { display: none; } span { font-size: .26rem; position: static; line-height: normal; margin-left: .5rem; vertical-align: top; font-weight: normal; } } .bottom-modal-check { &.active { background-image: url('/images/mobile/center/user/bottom-checked.png'); } span { font-size: .32rem; } } .mobile-hover-pager { position: fixed; top: 1.26rem; width: 100%; bottom: 0; background: rgb(255, 255, 255); } // 头部切换 .com-switch-head { height: .82rem; line-height: .82rem; text-align: center; background: #fff; .com-switch-item { font-size: .28rem; &:first-child { margin-right: 1.24rem; } &.active { color: #3f84f6; border-bottom: 1px solid #3f84f6; } } } .com-select-wrap { position: relative; width: 1.25rem; height: .5rem; line-height: .5rem; font-size: .28rem; color: #666; border: 1px solid #bfbfbf; border-radius: .04rem; margin: 0 auto; text-align: left; padding: 0 .23rem; background: url('/images/mobile/select-arrow.png')no-repeat; background-size: .12rem .06rem; background-position: .94rem .2rem; .select-list { position: absolute; left: -.02rem; top: .48rem; border: 1px solid #bfbfbf; width: 1.25rem; -webkit-box-shadow: 0 1px 5px 0 #aaa; -moz-box-shadow: 0 1px 5px 0 #aaa; box-shadow: 0 1px 5px 0 #aaa; border-radius: .04rem; li { background: #fff; text-align: left; padding: 0 .2rem; font-size: .28rem; height: .73rem; line-height: .73rem; &:active, &:focus { background: $base-color; color: #fff; } } } }