/* 版心确定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; } /* 底部完成 */