forked from develop/jiajia-h5
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
269 lines
4.4 KiB
269 lines
4.4 KiB
/* 版心确定1200 */
|
|
|
|
.w{
|
|
width: 1200px;
|
|
margin: 0 auto;
|
|
}
|
|
/* 调用字体图标 */
|
|
@font-face {
|
|
font-family: 'icomoon';
|
|
src: url('../fonts/icomoon.eot');
|
|
src: url('../fonts/icomoon.eot?7kkyc2#iefix') format('embedded-opentype'),
|
|
url('../fonts/icomoon.ttf?7kkyc2') format('truetype'),
|
|
url('../fonts/icomoon.woff?7kkyc2') format('woff'),
|
|
url('../fonts/icomoon.svg?7kkyc2#icomoon') format('svg');
|
|
font-weight: normal;
|
|
font-style: normal;
|
|
}
|
|
|
|
.shortcut{
|
|
width: 100%;
|
|
height: 31px;
|
|
line-height: 31px;
|
|
background-color: #f1f1f1;
|
|
|
|
}
|
|
.fl{
|
|
float: left;
|
|
}
|
|
.fr{
|
|
float: right;
|
|
}
|
|
.style_red{
|
|
color: #c81623;
|
|
}
|
|
.shortcut ul li{
|
|
float: left;
|
|
}
|
|
|
|
.shortcut .fr ul li:nth-child(even){
|
|
width: 1px;
|
|
height: 12px;
|
|
background-color: #666;
|
|
margin: 9px 15px 0;
|
|
}
|
|
.arrow_icon::after{
|
|
content: "\e91e";
|
|
font-family: icomoon;
|
|
margin-left: 3px;
|
|
}
|
|
/* 头部开始了 */
|
|
.header{
|
|
position: relative;
|
|
height: 105px;
|
|
background-color: pink;
|
|
}
|
|
.logo{
|
|
position: absolute;
|
|
top: 25px;
|
|
width: 171px;
|
|
height: 61px;
|
|
/* background-color: blue; */
|
|
}
|
|
|
|
.logo a{
|
|
display: block;
|
|
width: 171px;
|
|
height: 61px;
|
|
background: url(../images/logo.png);
|
|
/* 为了文字看不到,我们给了个写法 */
|
|
/* font-size: 0; 京东做法*/
|
|
/* 淘宝做法 */
|
|
text-indent: -999px;
|
|
overflow: hidden;
|
|
}
|
|
.search{
|
|
width: 538px;
|
|
height: 36px;
|
|
border: 2px solid red;
|
|
position: absolute;
|
|
left: 346px;
|
|
top: 25px;
|
|
}
|
|
.search input{
|
|
float: left;
|
|
width: 454px;
|
|
height: 32px;
|
|
padding-left: 10px;
|
|
}
|
|
.search button{
|
|
float: right;
|
|
width: 80px;
|
|
height: 32px;
|
|
background-color: red;
|
|
font-size: 16px;
|
|
color: #fff;
|
|
}
|
|
.hotword{
|
|
position: absolute;
|
|
top: 66px;
|
|
left: 346px;
|
|
}
|
|
.hotword a{
|
|
margin: 0 10px;
|
|
}
|
|
.shopcar{
|
|
position: absolute;
|
|
top: 25px;
|
|
right: 60px;
|
|
width: 140px;
|
|
height: 35px;
|
|
line-height: 35px;
|
|
text-align: center;
|
|
border: 1px solid #efefef;
|
|
background-color: #f1f1f1;
|
|
}
|
|
.shopcar::before{
|
|
font-family: 'icomoon';
|
|
content: "\ea44";
|
|
margin-right: 5px;
|
|
color: red;
|
|
}
|
|
.shopcar::after{
|
|
font-family: 'icomoon';
|
|
content: "\ea44";
|
|
margin-left: 5px;
|
|
color: red;
|
|
}
|
|
.count{
|
|
position:absolute;
|
|
top: -5px;
|
|
left: 105px;
|
|
height: 14px;
|
|
line-height: 14px;
|
|
color: #fff;
|
|
background-color: red;
|
|
padding: 0 5px;
|
|
border-radius: 7px 7px 7px 0;
|
|
}
|
|
.nav{
|
|
height: 47px;
|
|
border-bottom: 2px solid #b1191a;
|
|
}
|
|
.nav .dropdown{
|
|
float: left;
|
|
width: 210px;
|
|
height: 45px;
|
|
background-color: #b1191a;
|
|
}
|
|
|
|
.nav .navitems{
|
|
float: left;
|
|
}
|
|
.dropdown .dt{
|
|
width: 100%;
|
|
height: 100%;
|
|
color: #fff;
|
|
line-height: 45px ;
|
|
text-align: center;
|
|
font-size: 16px;
|
|
}
|
|
.dropdown .dd{
|
|
/* display: none; */
|
|
width: 210px;
|
|
height: 465px;
|
|
background-color: #c81623;
|
|
}
|
|
.dropdown .dd ul li{
|
|
position: relative;
|
|
height: 31px;
|
|
line-height: 31px;
|
|
margin-left: 2px;
|
|
|
|
|
|
}
|
|
.dropdown .dd ul li:hover{
|
|
background-color: #fff;
|
|
|
|
}
|
|
.dropdown .dd ul li::after{
|
|
position: absolute;
|
|
top: 5px;
|
|
right: 5px;
|
|
color: #fff;
|
|
font-family: 'icomoon';
|
|
content: "\e920";
|
|
}
|
|
|
|
.dropdown .dd ul li a{
|
|
font-size: 14px;
|
|
color: #fff;
|
|
|
|
|
|
}
|
|
.dropdown .dd ul li:hover a{
|
|
color: #c81623;
|
|
}
|
|
.navitems ul li{
|
|
float: left;
|
|
}
|
|
.navitems ul li a{
|
|
display: block;
|
|
height: 45px;
|
|
line-height: 45px;
|
|
padding: 0 25px;
|
|
}
|
|
/* 底部模块制作 */
|
|
.footer{
|
|
|
|
height: 415px;
|
|
background-color: #f5f5f5;
|
|
padding-top: 30px;
|
|
}
|
|
.mod_service{
|
|
height: 80px;
|
|
/* border: 1px solid #999; */
|
|
}
|
|
.mod_service ul li{
|
|
float: left;
|
|
width: 299px;
|
|
height: 50px;
|
|
|
|
padding-left: 35px;
|
|
}
|
|
.mod_service ul li h5{
|
|
|
|
float: left;
|
|
width: 50px;
|
|
height: 50px;
|
|
background: url(../images/icons.png) no-repeat -252px -2px;
|
|
margin-right: 6px;
|
|
}
|
|
.service-_txt h4{
|
|
font-size: 14px;
|
|
}
|
|
.service-_txt p{
|
|
font-size: 12px;
|
|
}
|
|
.mod_help{
|
|
height: 185px;
|
|
border-bottom: 1px solid #999;
|
|
margin-top: 20px;
|
|
margin-left: 50px;
|
|
}
|
|
.mod_help dl{
|
|
float: left;
|
|
width: 200px;
|
|
}
|
|
.mod_help dl:last-child{
|
|
width: 90px;
|
|
text-align: center;
|
|
}
|
|
.mod_help dl dt{
|
|
font-size: 16px;
|
|
margin-bottom: 10px;
|
|
}
|
|
.mod_copyright{
|
|
text-align: center;
|
|
padding-top: 20px;
|
|
}
|
|
.links{
|
|
margin-bottom: 15px;
|
|
}
|
|
.links a{
|
|
margin: 0 auto;
|
|
}
|
|
.copyringht{
|
|
line-height: 20px;
|
|
}
|
|
/* 底部完成 */
|