原本清明节出去浪的,怎奈何居然下雪了,没办法,在寝室仿个站(前端),来回顾一下前端知识吧
公共样式:
/* common */ *{ margin: 0px; padding:0px; font-size: 15px; } ul{ list-style: none; } .left{ float: left; } .right{ float: right; } .center{ text-align: center; } .hide{ display: none; } .content-center{ margin: auto; width: 980px; } .clearfix:after{ clear:both; content:'fdaef'; display: block; height: 0px; visibility: hidden; } /*客服*/ .service{ position: fixed; top:240px; right: 10px; height: 65px; width: 65px; border-radius: 50%; background-color: #b5dac8; } .service .icon{ font-size: 24px !important; } .service .text span{ font-size: 12px; } /* heading */ .head{ height:48px; background-color: #122b40; } .head .menu{ margin: auto; width: 980px; height: 100%; } .head .menu a,.left .logo a{ text-decoration: none; display: inline-block; width: 88px; text-align: center; line-height: 48px; height: 48px; color: white; } .head .menu a:hover{ background-color: white; opacity: 0.2; color: black; } .head .menu .logo{ background: url("../../public/images/logo/head_logo.png") no-repeat; background-color: white; background-size: 105px 44px; width: 110px; height: 44px; border: 1px solid white; margin: 2px 0; } .tel{ margin-top: 10px; margin-bottom: 10px; color: white; } .tel .glyphicon-headphones, span{ font-size: 20px; } /* slider */ .slider .bx-wrapper{ border: 0px !important; margin-bottom: 0px; } .bxslider li img{ height: 300px; width:100%; } .bx-wrapper .bx-pager, .bx-wrapper .bx-controls-auto { bottom: 25px !important; } /* copy-right */ .bottom{ margin-top: 20px; } .bottom .copy-right{ border-top:2px solid dodgerblue; } .bottom .copy-right p{ margin-top: 10px; color: #9d9d9d; font-size: 12px; } .bottom .copy-right a{ text-decoration: none; color: #9d9d9d; font-size: 12px; }