www.gusucode.com > 高端网络公司+论坛网站源码程序 > 高端网络公司+论坛/整站安装/整站源码/template/week_touch/touch/images/mobile.css
@charset 'UTF-8'; /* Design By haoweek.com */ @media screen and (min-width:320px) { html { font-size:100.00px;} } /****************************************pad*************************************************/ @media only screen and (max-width:800px) {} /*****************************************phone plus*****************************************/ @media (max-width:1600px) { html,body {width: 100%;height: 100%;} body {font-size:.12rem; line-height:1.5; text-size-adjust:100%; -ms-text-size-adjust:100%; -webkit-text-size-adjust:100%; -webkit-font-smoothing: antialiased;} /* Font css */ .f64{font-size:.52rem;} .f60{font-size:.48rem;} .f52{font-size:.41rem;} .f48{font-size:.32rem;} .f32{font-size:.24rem;} .f28{font-size:.22rem;} .f24{font-size:.20rem;} .f22{font-size:.16rem;} .f18{font-size:.15rem;} .f16{font-size:.14rem;} .f15{font-size:.14rem;} .f14{font-size:.12rem;} /* Btn css */ .comm-Btn,.comm-Btn:hover{ padding:0 .34rem; line-height:.34rem; color:#FFF; } /* comm css */ .container{padding:0 .12rem; max-width:100%; min-width:100%;} .wk-case,.wk-index-contact,.wk-clients,.wk-friends,.wk-items-list,.wk-abtdiv,.wk-gettouch,.wk-about,.wk-data,.wk-space,.wk-team,.wk-job{width:100%; min-width:100%; padding:.44rem 0;} /* title css */ .title-index{padding:0 .12rem; font-weight:200;} /* header*/ .wk-header{padding-top:10px; padding-bottom:10px; height:60px;} .wk-header h1 a.logo{width:40px; height:40px; background-size:40px 40px;} .wk-header ul.nav{display:none;} .wk-header-scroll{padding-top:10px; padding-bottom:10px; height:60px;background:rgba(255,255,255,.96);} .wk-header-scroll h1 a.logo{display:block; width:150px; height:40px; text-indent:-9999px; background:url(logo.png) no-repeat center; background-size:150px 40px;} /*right menu*/ .menu,.slideout-menu {position:fixed; top:0;bottom:0;right:0;z-index:0; width:256px; overflow-y:scroll; -webkit-overflow-scrolling:touch; display:none;} .panel,.slideout-panel {position: relative;z-index:1;} .slideout-open,.slideout-open body {overflow: hidden;} .slideout-open .slideout-menu {display: block;} .wk-mobile-nav{padding:15px; color:#ccc; background:url(lights.jpg) no-repeat center center;} .mobile-nav-list { width:100%; margin-bottom:15px; overflow:hidden; } .mobile-nav-list li { width:45%; margin-right:4%; margin-bottom:10px; text-align:center; float:left; border:1px solid #CCC; height:40px; line-height:40px; border-radius:10px; overflow:hidden; } .mobile-nav-list li a,.mobile-nav-list li a:hover{padding:0; display:block; font-size:16px; line-height:40px; color:#eee; text-decoration:none;} .mobile-bb-list { width:100%; margin-bottom:15px; overflow:hidden; } .mobile-bb-list li { width:28%; margin-right:4%; text-align:center; float:left; border:1px solid #CCC; background:#EEE; height:30px; line-height:30px; border-radius:8px; overflow:hidden; } .mobile-bb-list li a,.mobile-nav-list li a:hover{padding:0; display:block; font-size:14px; line-height:30px; color:#333; text-decoration:none;} .site-infor{padding:.12rem 0; border-top:1px solid #999;} .wk_headhy { width:100%; height:150px; } .wk_headhytx { float:left; width:240px; height:60px; margin:10px 0; overflow:hidden; } .wk_headhytx01 { height:54px; width:54px; margin-left:10px; margin-top:3px; float:left; overflow:hidden; } .wk_headhytx01 img { width:48px; height:48px; overflow:hidden; border:2px solid #CCC; border-radius:50%; } .wk_headhytx02 { width:120px; height:60px; margin-top:2px; margin-left:30px; float:left; overflow:hidden; } .wk_headhytx02 span { height:28px; line-height:28px; text-align:left; float:left; width:120px; } .wk_headhytx02 span a {font-size:14px; color:#F6F6F6;} .wk_headhybt { float:left; height:40px; margin-top:10px; width:100%; overflow:hidden; } .wk_headhybt ul { width:100%; height:32px; } .wk_headhybt ul li { float:left; width:21%; margin-right:3%; border:1px solid #CCC; border-radius:8px; overflow:hidden; text-align:center; height:30px; line-height:30px; } .wk_headhybt ul li a { font-size:14px; color:#FFF; } /*menu icon*/ .toggle-btn{position:fixed; top:0; right:0; z-index:2000; display:block; border:none; outline:none; width:60px; height:60px; padding-top:12px; -webkit-tap-highlight-color:rgba(0,0,0,0);} .icon-i{margin:6px auto; display:block; width:30px; height:3px; background:#ea3340;} /* footer */ .wk-footer{padding:0 0 0.65rem 0; min-width:100%;} .footer-box{float:left; width:100%;} .footer-nav{overflow:hidden; margin:0 0 .1rem; padding-bottom:0; border-bottom:1px solid #aaa;} .footer-nav li{width:20%; float:left; text-align:center; padding:0;} .footer-nav li a{line-height:.5rem; font-size:.16rem; } .footer-nav li a:hover{text-decoration:none; color:#ccc;} .logo-en{margin:.2rem 0 .12rem; display:block; width:238px; height:18px; background:url(logo_en_2x.png) no-repeat center top; background-size:238px 18px;} .fr{float:left;} .tright{text-align:left;} /*slider index*/ #Slider-index .slick {width:100%; margin: 0 auto; min-width:100%;} #Slider-index .slick-dots {bottom: .2rem;} /* index service item */ .wk-service-item{min-width:100%;} .wk-service-item .container{padding:0;} .service-item li{width:100%; border-left:0px solid #ddd; border-bottom:1px solid #ddd; } .service-item li:last-child{border-right:0px solid #ddd;} .service-item li a,.service-item li a:hover{padding:.2rem; display:block; text-decoration:none; text-align:left; background-image:url(arr_comm.png); background-repeat:no-repeat; background-position:94% center; background-size:.22rem;} .service-item li a span{padding:.06rem .06rem .06rem .7rem;} .service-item li a span h3{line-height:.26rem;} .service-item li a span p{line-height:.2rem;} .service-item li a span.service-ue{background:url(icon_ue.png) no-repeat 0px 0px; background-size:.5rem;} .service-item li a:hover span.service-ue{background:url(icon_ue.png) no-repeat 0px -.5rem; background-size:.5rem;} .service-item li a span.service-ui{background:url(icon_ui.png) no-repeat 0px 0px; background-size:.5rem;} .service-item li a:hover span.service-ui{background:url(icon_ui.png) no-repeat 0px -.5rem; background-size:.5rem; } .service-item li a span.service-dev{background:url(icon_dev.png) no-repeat 0px 0px; background-size:.5rem;} .service-item li a:hover span.service-dev{background:url(icon_dev.png) no-repeat 0px -.5rem; background-size:.5rem; } /* case*/ .wk-case .container{padding:0;} .case-list li{width:50%; margin:.2rem 0 0; } .case-list li a h4,.case-list li a:hover h4{width:90%; margin:0 5px; line-height:.32rem;} .case-list li a p,.case-list li a:hover p{display: block;} /* index contact */ .wk-index-contact {background-attachment:scroll;} .wk-index-contact h3{width:80%;} .wk-index-contact p{width:90%;} .btn-box{margin:.12rem auto 0;} .wk-index-contact p.btn-box a{font-size:.16rem;} /* client commemt */ .wk-clients .title-index{padding:0; } #Slider-say .slick {width:100%; padding:.24rem .12rem;} #Slider-say .slick div.slidbox h3{margin:0 0 .2rem; font-size:.20rem;} #Slider-say .slick div.slidbox p{margin:0 0 .2rem;} #Slider-say .slick-dots { bottom: .0rem;} /* friends */ .wk-friends ul.friends-list li{margin:.12rem 0; padding:.12rem 0; width:50%; } /*map*/ /*.wk-map{position:relative; height:3.2rem; min-width:100%;}*/ .mark-info{padding:.12rem 0;} .mark-info h4{margin:0; line-height:.25rem; font-size:.16rem; color:#fff; font-weight:300;} .mark-info a,.mark-info a:hover{color:#fff; text-decoration:none;} /*show txt style*/ .show-txtstyle-center h5{display:none;} .show-txtstyle-center .f64{font-size:.32rem;} .show-txtstyle-center h3.f48{font-size:.22rem;} .show-txtstyle-center p.iconimg img{margin:0 auto 2%; width:68px;} /*show txt style end*/ } /*************************************************phone************************************/ @media only screen and (max-width:640px) {} @media only screen and (max-width:320px) { /* Font css */ .f64{font-size:.39rem;} .f60{font-size:.36rem;} .f52{font-size:.32rem;} .f48{font-size:.28rem;} .f32{font-size:.20rem;} .f22{font-size:.16rem;} .f16{font-size:.14rem;} .f14{font-size:.12rem;} /* header*/ .wk-header{padding-top:15px; padding-bottom:15px;height:60px;} .wk-header h1 a.logo{width:30px; height:30px; background-size:30px 30px;} .wk-header-scroll{padding-top:15px; padding-bottom:15px;height:60px; background:rgba(255,255,255,.96);} .wk-header-scroll h1 a.logo{width:132px; height:30px; background-size:132px 30px;} /*menu icon*/ .toggle-btn{width:50px; height:50px; padding-top:14px;} .icon-i{width:26px; height:2px; } /*right menu*/ .mobile-nav-list li a,.mobile-nav-list li a:hover{font-size:.14rem; line-height:.44rem;} #Slider-say .slick div.slidbox h3{font-size:.18rem;} .wk-fix-sort ul li a,.wk-fix-sort ul li a:hover{font-size:.14rem;} } .wk_hmenu {position:relative; top:-7px; right:12px; }