html,body { width: 100%; min-height: 100%; background: #f3eeeb; font-size: 16px; font-family: '微软雅黑' } .h80 { height: 80px; } .h40 { height: 3em; } .h20 { height: 20px; } .h10 { height: 10px; background: #e5e5e5; } .h1 { height: 1px; margin-left: 15px; background: #e5e5e5; } .fr { float: right; } .fl { float: left; } .hightitem { background-color: #fff; } .inwrap { padding-right: 15px; padding-left: 15px; } #wrap { height: 100%; display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-flex-flow: column; flex-flow: column; } #header { width: 100%; height: 3em; background: #261913; position:fixed; top: 0; left: 0; z-index: 1000; } .h_back { position: absolute; top: 0; left: 0; padding-top: 1em; margin-left: 1em; } .h_back img { width: 1.5em; height: 1.18em; } .h_title { margin: 0 auto; height: 3em; line-height: 2.2em; font-size: 1.25em; color: #fff; text-align: center; } .h_home { position: absolute; top: 0; right: 0; padding-top: 1em; margin-right: 1em; } .h_home img { width: 1.4em; height: 1.4em; } #main { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-orient: vertical; -webkit-flex-flow: column; flex-flow: column; margin-bottom: 1em; } #footer { width: 100%; height: 3em; background: #261913; position:fixed; bottom: 0; left: 0; padding-top: 1em; z-index: 1000; } .f_button { display: block; width: 8em; margin: 0 auto; height: 2em; background: #6f5d52; line-height: 2em; border-radius: 5px; -moz-border-radius: 5px; } .f_button .f_title { height: 2em; font-size: 1em; color: #fff; text-align: center; } .f_button1 { width: 50%; height: 2em; float: left; display: block; } .f_submit { position: relative; left: 0%; display: block; width: 2em; margin: 0 auto; height: 2em; background: #f53a00; padding: 0 2em; line-height: 2em; border-radius: 5px; -moz-border-radius: 5px; } .f_reset { position: relative; right: 0%; display: block; width: 2em; margin: 0 auto; height: 2em; background: #6f5d52; padding: 0 2em; line-height: 2em; border-radius: 10px; -moz-border-radius: 10px; } .con { font-size: 1em; text-align: center; } .clear { clear: both; } #divButton{ width:100%; margin:0 auto; text-align:center; position: relative; bottom:0; } #footer ul { width:100%; margin:0 auto; display: -webkit-box; display: -webkit-flex; display: flex; } #footer li { width:25%; margin-left:8%; -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; } .home { background-image: url(images/mobile/home_1.png); } .sou { background-image: url(images/mobile/search.png); } .fenlei { background-image: url(images/mobile/3.png); } .cart { background-image: url(images/mobile/4.png); } .me { background-image: url(images/mobile/5.png); } .bottom_btn { background-position-y: 4px; padding-top: 30px; font-size: 12px; color: #fff; height: 39px; background-repeat: no-repeat no-repeat; background-position-x: center; background-size: 25px; margin:0 auto; } .active .home { background-image: url(images/mobile/1n.png); } .active .sou { background-image: url(images/mobile/2n.png); } .active .fenlei { background-image: url(images/mobile/3n.png); } .active .cart { background-image: url(images/mobile/4n.png); } .active .me { background-image: url(images/mobile/5n.png); } .active .bottom_btn { color: #FF6600; background-size: 25px; margin:0 auto; background-position-x: center; }