1 <!DOCTYPE html> 2 <html> 3 4 <head> 5 <meta charset="UTF-8"> 6 <title>京东JD</title> 7 <link rel="stylesheet" href="css/baseJD.css" /> 8 <link rel="icon" href="img/favicon.ico"> 9 </head> 10 11 <body> 12 <!--nav开始--> 13 <div class="site-nav"> 14 <div class="w"> 15 <div class="fl"> 16 <div class="site-nav-send"> 17 送至：北京 18 <i><s>◇</s></i> 19 </div> 20 </div> 21 22 <div class="site-nav-right fr "> 23 <ul> 24 <li> 25 <a href="#">你好，请登录</a> 26 <a href="#">免费注册</a> 27 </li> 28 <li class="line"></li> 29 <li> 30 <a href="#">我的订单</a> 31 </li> 32 <li class="line"></li> 33 <li class="fore "> 34 <a href="#">我的京东</a> 35 36 <i><s>◇</s></i> 37 </li> 38 <li class="line"></li> 39 <li> 40 <a href="#">京东会员</a> 41 </li> 42 <li class="line"></li> 43 <li> 44 <a href="#">企业采购</a> 45 </li> 46 <li class="line"></li> 47 <li class="fore jd-tel"> 48 49 <a href="#">手机京东</a> 50 <span></span> 51 <i id="jd-tel"><s>◇</s></i> 52 </li> 53 <li class="line"></li> 54 <li class="fore"> 55 关注京东 56 <i><s>◇</s></i> 57 </li> 58 <li class="line"></li> 59 <li class="fore"> 60 客户服务 61 <i><s>◇</s></i> 62 </li> 63 <li class="line"></li> 64 <li class="fore"> 65 网站导航 66 <i><s>◇</s></i> 67 </li> 68 69 </ul> 70 71 </div> 72 </div> 73 74 </div> 75 <!--nav结束--> 76 <!--top-banner开始--> 77 <div class="top-banner"> 78 <div class="w top-banner-conter"> 79 <a href="#"> 80 <img src="img/top-banner.jpg" alt="" /> 81 </a> 82 <a href="#" class="close-banner"></a> 83 </div> 84 85 </div> 86 <!--top-banner结束--> 87 <!--search开始--> 88 <div class="w clearfix"> 89 <div class="search-logo"> 90 <a href="#">京东</a> 91 </div> 92 <div class="search-input"> 93 <input type="text" value="运动相机" /> 94 <button>搜索</button> 95 </div> 96 <div class="search-car"> 97 <a href="#">我的购物车</a> 98 <i class="search-car-gwc"></i> 99 <i class="search-car-jt">></i> 100 <i class="search-car-mag">6</i> 101 </div> 102 <div class="search-moreAlink"> 103 <ul> 104 <li> 105 <a href="#" class="col-red">30底130</a> 106 </li> 107 <li> 108 <a href="#">69元秒风扇</a> 109 </li> 110 <li> 111 <a href="#">农用物资</a> 112 </li> 113 <li> 114 <a href="#">200减40</a> 115 </li> 116 <li> 117 <a href="#">啤酒趴</a> 118 </li> 119 <li> 120 <a href="#">早教机</a> 121 </li> 122 <li> 123 <a href="#">柠檬</a> 124 </li> 125 <li> 126 <a href="#">0元试用</a> 127 </li> 128 <li> 129 <a href="#">海苔</a> 130 </li> 131 </ul> 132 </div> 133 </div> 134 </div> 135 <!--search结束--> 136 <!--shortcut-nav开始--> 137 <div class="shortcut-nav" /> 138 <div class="w"> 139 <div class="shortcut-nav-menu"> 140 <div class="shortcut-nav-menu-all"> 141 <a href="#">全部商品分类</a> 142 </div> 143 <div class="shortcut-nav-one"> 144 <ul> 145 <li> 146 <a href="#">家用电器</a><span>></span></li> 147 <li> 148 <a href="#">手机、运营商、数码</a><span>></span></li> 149 <li> 150 <a href="#">电脑、办公</a><span>></span></li> 151 <li> 152 <a href="#">家具、家居、家装、厨具</a><span>></span></li> 153 <li> 154 <a href="#">男装、女装、童装、内衣</a><span>></span></li> 155 <li> 156 <a href="#">美妆、个护清洁、宠物</a><span>></span></li> 157 <li> 158 <a href="#">女鞋、箱包、钟表</a><span>></span></li> 159 <li> 160 <a href="#">男鞋、运动、户外</a><span>></span></li> 161 <li> 162 <a href="#">房产、汽车、汽车用品</a><span>></span></li> 163 <li> 164 <a href="#">母婴、玩具、乐器</a><span>></span></li> 165 <li> 166 <a href="#">食品、酒类、生鲜特产</a><span>></span></li> 167 <li> 168 <a href="#">艺术、礼品鲜花、生农资绿植</a><span>></span></li> 169 <li> 170 <a href="#">美妆、个护清洁、宠物</a><span>></span></li> 171 172 </ul> 173 </div> 174 </div> 175 176 <div class="shortcut-nav-items fl "> 177 <ul> 178 <li> 179 <a href="#">服裝城</a> 180 </li> 181 <li> 182 <a href="#">美装馆</a> 183 </li> 184 <li> 185 <a href="#">京东超市</a> 186 </li> 187 <li> 188 <a href="#">生鲜</a> 189 </li> 190 <li> 191 <a href="#">全球购</a> 192 </li> 193 <li> 194 <a href="#">闪购</a> 195 </li> 196 <li> 197 <a href="#">团购</a> 198 </li> 199 <li> 200 <a href="#">拍卖</a> 201 </li> 202 <li> 203 <a href="#">金融</a> 204 </li> 205 206 </ul> 207 </div> 208 <div class="shortcut-nav-img fl"> 209 <a href="#"><img src="img/img2.jpg" alt="" /></a> 210 </div> 211 </div> 212 </div> 213 <!-- sub-banner开始--> 214 <div class="sub-banner"> 215 <a href="#"></a> 216 </div> 217 218 <!-- sub-banner结束--> 219 <!--main开始--> 220 <div class="w main clearfix"> 221 <div class="main-slider"> 222 <a href="#"><img src="img/slide.jpg" alt="" /></a> 223 <ul> 224 <li>1</li> 225 <li class="current">2</li> 226 <li>3</li> 227 <li>4</li> 228 <li>5</li> 229 <li>6</li> 230 </ul> 231 <div class="arrow"> 232 <a class="arrow-left" href="javascript:void(0)"><</a> 233 <a class="arrow-right" href="javascript:;">></a> 234 </div> 235 </div> 236 <div class="fr "> 237 <div class="main-news "> 238 <div class="main-top "> 239 <div class="main-top-faster"> 240 <div class="main-top-faster-title"> 241 <h2>京东快报</h2> 242 <a href="#">更多></a> 243 </div> 244 <div class="main-top-faster-content"> 245 <ul> 246 <li> 247 <a href="#"><span>[特惠]</span>自营文具每满198减100疯3天</a> 248 </li> 249 <li> 250 <a href="#"><span>[公告]</span>自营文具每满198减100疯3天</a> 251 </li> 252 <li> 253 <a href="#"><span>[特惠]</span>自营文具每满198减100疯3天</a> 254 </li> 255 <li> 256 <a href="#"><span>[公告]</span>自营文具每满198减100疯3天</a> 257 </li> 258 <li> 259 <a href="#"><span>[特惠]</span>自营文具每满198减100疯3天</a> 260 </li> 261 </ul> 262 </div> 263 </div> 264 <div class="main-top-money "> 265 <ul> 266 <li> 267 <a href="#"> 268 <i class="main-top-money-icon1"></i> 话费 269 </a> 270 </li> 271 <li> 272 <a href="#"> 273 <i class="main-top-money-icon2"></i> 机票 274 </a> 275 </li> 276 <li> 277 <a href="#"> 278 <i class="main-top-money-icon3"></i> 电影票 279 </a> 280 </li> 281 <li> 282 <a href="#"> 283 <i class="main-top-money-icon4"></i> 游戏 284 </a> 285 286 </li> 287 <li> 288 <a href="#"> 289 <i class="main-top-money-icon5"></i> 彩票 290 </a> 291 </li> 292 <li> 293 <a href="#"> 294 <i class="main-top-money-icon6"></i> 加油卡 295 </a> 296 </li> 297 <li> 298 <a href="#"> 299 <i class="main-top-money-icon7"></i> 酒店 300 </a> 301 </li> 302 <li> 303 <a href="#"> 304 <i class="main-top-money-icon8"></i> 火车票 305 </a> 306 </li> 307 <li> 308 <a href="#"> 309 <i class="main-top-money-icon9"></i> 众筹 310 </a> 311 </li> 312 <li> 313 <a href="#"> 314 <i class="main-top-money-icon10"></i> 理财 315 </a> 316 </li> 317 <li> 318 <a href="#"> 319 <span class="hot"></span> 320 <i class="main-top-money-icon11"></i> 礼品卡 321 </a> 322 </li> 323 <li> 324 <a href="#"> 325 326 <i class="main-top-money-icon12"></i> 白条 327 </a> 328 </li> 329 330 </ul> 331 </div> 332 333 </div> 334 <a href="#"> 335 <img src="img/img3.jpg" alt="" /> 336 <a/> 337 </div> 338 </div> 339 </div> 340 <!--main结束--> 341 <!--today开始--> 342 <div class="w today clearfix"> 343 <div class="today-left"> 344 <a href="#"></a> 345 </div> 346 <div class="today-right"> 347 <ul> 348 <li> 349 <a href="#"><img src="img/pic2.jpg" alt="" /></a> 350 </li> 351 <li> 352 <a href="#"><img src="img/pic3.jpg" alt="" /></a> 353 </li> 354 <li> 355 <a href="#"><img src="img/pic4.jpg" alt="" /></a> 356 </li> 357 <li> 358 <a href="#"><img src="img/pic5.jpg" alt="" /></a> 359 </li> 360 </ul> 361 <div class="arrow"> 362 <a class="arrow-left" href="javascript:void(0)"><</a> 363 <a class="arrow-right" href="javascript:;">></a> 364 </div> 365 </div> 366 </div> 367 <!--today结束--> 368 <!--footer部分start--> 369 <div class=" footer"> 370 <div class=" footer-top"> 371 <div class="w footer-top-slogen"> 372 <span class="footer-top-slogen-img footer-top-slogen-img1"><a href="#"><img src="img/slogen1.png" alt=""/></a></span> 373 <span class="footer-top-slogen-img footer-top-slogen-img2"><a href="#"><img src="img/slogen2.png" alt=""/></a></span> 374 <span class="footer-top-slogen-img footer-top-slogen-img3"><a href="#"><img src="img/slogen3.png" alt=""/></a></span> 375 <span class="footer-top-slogen-img footer-top-slogen-img4"><a href="#"><img src="img/slogen4.png" alt=""/></a></span> 376 </div> 377 <div class="w footer-top-shopping clearfix"> 378 <dl> 379 <dt>购物指南</dt> 380 <dd> 381 <a href="#">购物流程</a> 382 </dd> 383 <dd> 384 <a href="#">会员介绍</a> 385 </dd> 386 <dd> 387 <a href="#">生活旅行/团购</a> 388 </dd> 389 <dd> 390 <a href="#">常见问题</a> 391 </dd> 392 <dd> 393 <a href="#">大家电</a> 394 </dd> 395 <dd> 396 <a href="#">联系客服</a> 397 </dd> 398 </dl> 399 <dl> 400 <dt>配送方式</dt> 401 <dd> 402 <a href="#">上门自提</a> 403 </dd> 404 <dd> 405 <a href="#">211限时达</a> 406 </dd> 407 <dd> 408 <a href="#">配送服务查询</a> 409 </dd> 410 <dd> 411 <a href="#">配送费收取标准</a> 412 </dd> 413 <dd> 414 <a href="#">海外配送</a> 415 </dd> 416 </dl> 417 <dl> 418 <dt>购物指南</dt> 419 <dd> 420 <a href="#">购物流程</a> 421 </dd> 422 <dd> 423 <a href="#">会员介绍</a> 424 </dd> 425 <dd> 426 <a href="#">生活旅行/团购</a> 427 </dd> 428 <dd> 429 <a href="#">常见问题</a> 430 </dd> 431 <dd> 432 <a href="#">大家电</a> 433 </dd> 434 <dd> 435 <a href="#">联系客服</a> 436 </dd> 437 </dl> 438 <dl> 439 <dt>配送方式</dt> 440 <dd> 441 <a href="#">上门自提</a> 442 </dd> 443 <dd> 444 <a href="#">211限时达</a> 445 </dd> 446 <dd> 447 <a href="#">配送服务查询</a> 448 </dd> 449 <dd> 450 <a href="#">配送费收取标准</a> 451 </dd> 452 <dd> 453 <a href="#">海外配送</a> 454 </dd> 455 </dl> 456 <dl class="last-dl"> 457 <dt>购物指南</dt> 458 <dd> 459 <a href="#">购物流程</a> 460 </dd> 461 <dd> 462 <a href="#">会员介绍</a> 463 </dd> 464 <dd> 465 <a href="#">生活旅行/团购</a> 466 </dd> 467 <dd> 468 <a href="#">常见问题</a> 469 </dd> 470 <dd> 471 <a href="#">大家电</a> 472 </dd> 473 <dd> 474 <a href="#">联系客服</a> 475 </dd> 476 </dl> 477 <div class="coverage"> 478 <h3>京东自营覆盖区县</h3> 479 <p>京东已向全国2654个区县提供自营配送服务，支持货到付款、POS机刷卡和售后上门服务。</p> 480 <a href="#">查看详情 ></a> 481 </div> 482 </div> 483 </div> 484 485 <div class="w footer-bottom "> 486 <div class="footer-bottom-links "> 487 <a href="# ">关于我们</a>| 488 <a href="# ">联系我们</a>| 489 <a href="# ">联系客服</a>| 490 <a href="# ">商家入驻</a>| 491 <a href="# ">营销中心</a>| 492 <a href="# ">手机京东</a>| 493 <a href="# ">友情链接</a>| 494 <a href="# ">销售联盟</a>| 495 <a href="# ">京东社区</a>| 496 <a href="# ">京东公益</a>| 497 <a href="# ">English Site</a>| 498 <a href="# ">Contact Us</a>| 499 </div> 500 <div class="footer-bottom-copyright "> 501 <img src="img/guohui.png " /> 京公网安备 11000002000088号 | 京ICP证070359号 | 互联网药品信息服务资格证编号(京)-经营性-2014-0008 | 新出发京零 字第大120007号<br/> 互联网出版许可证编号新出网证(京)字150号 | 出版物经营许可证 | 网络文化经营许可证京网文[2014]2148-348号 | 违法和不良信息举报电话：4006561155<br/> Copyright © 2004 - 2016 京东JD.com 版权所有 | 消费者维权热线：4006067733 <br/> 京东旗下网站：京东钱包 502 503 </div> 504 505 <div class="footer-bottom-img "> 506 <a href="# "><img src="img/img1.jpg " alt=" " /></a> 507 <a href="# "><img src="img/img1.jpg " alt=" " /></a> 508 <a href="# "><img src="img/img1.jpg " alt=" " /></a> 509 <a href="# "><img src="img/img1.jpg " alt=" " /></a> 510 <a href="# "><img src="img/img1.jpg " alt=" " /></a> 511 <a href="# "><img src="img/img1.jpg " alt=" " /></a> 512 </div> 513 </div> 514 </div> 515 <!--footer部分end--> 516 </body> 517 518 </html>
1 /*css初始化*/ 2 3 html, 4 body, 5 ul, 6 li, 7 ol, 8 dl, 9 dd, 10 dt, 11 p, 12 h1, 13 h2, 14 h3, 15 h4, 16 h5, 17 h6, 18 form, 19 fieldset, 20 legend, 21 img { 22 margin: 0; 23 padding: 0; 24 } 25 26 fieldset, 27 img, 28 input, 29 button { 30 /*fieldset组合表单中的相关元素*/ 31 border: none; 32 padding: 0; 33 margin: 0; 34 outline-style: none; 35 } 36 37 ul, 38 ol { 39 /*清除列表风格*/ 40 list-style: none; 41 } 42 43 input { 44 padding-top: 0; 45 padding-bottom: 0; 46 font-family: "SimSun", "宋体"; 47 } 48 49 select, 50 input, 51 textarea { 52 font-size: 12px; 53 margin: auto; 54 } 55 56 textarea { 57 /* 防止多行文本框拖动*/ 58 resize: none; 59 } 60 61 img { 62 /*去掉图片底侧默认的3像素空白缝隙*/ 63 border: 0; 64 vertical-align: middle; 65 } 66 67 table { 68 border-collapse: collapse; 69 /*合并外边线*/ 70 } 71 72 body { 73 font: 12px/150% Arial, Verdana, "\5b8b\4f53"; 74 /* 宋体,Unicode,统一编码*/ 75 color: #666; 76 background: #fff; 77 } 78 79 .clearfix:before, 80 .clearfix:after { 81 content: ""; 82 display: table; 83 } 84 85 .clearfix:after { 86 clear: both; 87 } 88 89 .clearfix { 90 *zoom: 1/*IE/7/6*/ 91 } 92 93 a { 94 color: #666; 95 text-decoration: none; 96 } 97 98 a:hover { 99 color: #c81623; 100 } 101 102 h1, 103 h2, 104 h3, 105 h4, 106 h5, 107 h6 { 108 text-decoration: none; 109 font-weight: normal; 110 font-size: 100%; 111 } 112 113 s, 114 i, 115 em { 116 font-style: normal; 117 text-decoration: none; 118 } 119 120 .col-red { 121 color: #C81623 !important; 122 } 123 /*公共类*/ 124 125 .w { 126 /*版心 提取*/ 127 width: 1210px; 128 margin: 0 auto; 129 } 130 131 .fl { 132 float: left; 133 } 134 135 .fr { 136 float: right; 137 } 138 139 .al { 140 text-align: left; 141 } 142 143 .ac { 144 text-align: center; 145 } 146 147 .atr { 148 text-align: right; 149 } 150 /*nav开始*/ 151 152 .site-nav { 153 height: 30px; 154 width: 100%; 155 line-height: 30px; 156 background: rgb(240, 240, 240); 157 } 158 159 .site-nav-send, 160 .site-nav-right .fore { 161 position: relative; 162 padding: 0 20px 0 10px; 163 } 164 165 .site-nav-send i { 166 width: 13px; 167 height: 8px; 168 position: absolute; 169 left: 74px; 170 top: 12px; 171 overflow: hidden; 172 } 173 174 .fore i { 175 width: 13px; 176 height: 8px; 177 position: absolute; 178 left: 60px; 179 top: 12px; 180 overflow: hidden; 181 } 182 183 .site-nav s, 184 .fore s { 185 position: absolute; 186 top: -13px; 187 font: 400 19px/150% "consolas"; 188 } 189 190 .site-nav-right li { 191 float: left; 192 padding: 0 10px; 193 } 194 195 .site-nav-right .line { 196 width: 1px; 197 height: 12px; 198 background: #DDD; 199 margin-top: 9px; 200 padding: 0px; 201 } 202 203 .site-nav-right .jd-tel { 204 padding-left: 23px; 205 } 206 207 .site-nav-right .jd-tel span { 208 position: absolute; 209 display: block; 210 height: 20px; 211 width: 15px; 212 top: 5px; 213 left: 6px; 214 background: url(../img/tel.png)no-repeat; 215 } 216 217 .site-nav-right .jd-tel #jd-tel { 218 padding-left: 12px; 219 } 220 /*nav结束*/ 221 /*top-banner开始*/ 222 223 .top-banner { 224 background: rgb(55, 194, 251); 225 } 226 227 .top-banner-conter { 228 position: relative; 229 } 230 231 .close-banner { 232 position: absolute; 233 top: 5px; 234 right: 5px; 235 width: 19px; 236 height: 19px; 237 background: url(../img/close-banner.png)no-repeat; 238 } 239 240 .close-banner:hover { 241 background-position: bottom; 242 } 243 /*top-banner结束*/ 244 /*search开始*/ 245 246 .search-logo { 247 width: 362px; 248 height: 60px; 249 padding: 20px 0; 250 float: left; 251 } 252 253 .search-logo a { 254 float: left; 255 height: 60px; 256 width: 270px; 257 text-indent: -5000px; 258 background: url(../img/logo.png)no-repeat; 259 } 260 261 .search-input { 262 float: left; 263 width: 538px; 264 height: 36px; 265 padding-top: 25px; 266 } 267 268 .search-input input { 269 padding-left: 5px; 270 float: left; 271 color: #cccccc; 272 width: 449px; 273 height: 32px; 274 border: 2px solid #B61D1D; 275 border-right: 0; 276 } 277 278 .search-input button { 279 float: left; 280 height: 36px; 281 width: 82px; 282 background-color: #B61D1D; 283 color: #fff; 284 font: 400 16px/36px "microsoft yahei"; 285 cursor: pointer; 286 } 287 288 .search-car { 289 float: right; 290 width: 139px; 291 height: 34px; 292 text-align: center; 293 position: relative; 294 line-height: 34px; 295 margin: 25px 65px 0 0; 296 background-color: #F9F9F9; 297 border: 1px solid #ddd; 298 } 299 300 .search-car-gwc { 301 position: absolute; 302 width: 18px; 303 height: 16px; 304 top: 9px; 305 left: 18px; 306 background: url(../img/tel.png)0 -58px; 307 } 308 309 .search-car-jt { 310 position: absolute; 311 font: 400 13px/34px simsun; 312 right: 10px; 313 } 314 315 .search-car-mag { 316 position: absolute; 317 width: 15px; 318 height: 15px; 319 border-radius: 7px 7px 7px 0; 320 top: -7px; 321 right: 30px; 322 background: #c00; 323 color: #fff; 324 line-height: 15px; 325 text-align: center; 326 } 327 328 .search-moreAlink { 329 float: left; 330 width: 520px; 331 height: 28px; 332 } 333 334 .search-moreAlink li { 335 float: left; 336 margin-right: 10px; 337 } 338 /*search结束*/ 339 /*shortcut-nav开始*/ 340 341 .shortcut-nav { 342 width: 100%; 343 height: 45px; 344 border-bottom: 2px solid rgb(177, 25, 26); 345 } 346 347 .shortcut-nav-menu { 348 width: 210px; 349 height: 45px; 350 float: left; 351 position: relative; 352 z-index: 1; 353 } 354 355 .shortcut-nav-menu-all a { 356 display: block; 357 width: 190px; 358 height: 45px; 359 color: white; 360 padding: 0 10px; 361 background-color: #B1191A; 362 font: 400 15px/44px "microsoft yahei"; 363 } 364 365 .shortcut-nav-one { 366 height: 465px; 367 margin-top: 2px; 368 background: #C81623; 369 border-left: 1px solid #B1191A; 370 border-bottom: 1px solid #B1191A; 371 } 372 373 .shortcut-nav-one ul { 374 padding-top: 5px; 375 } 376 377 .shortcut-nav-one li { 378 margin-top: 5px; 379 height: 30px; 380 line-height: 30px; 381 } 382 383 .shortcut-nav-one a { 384 color: white; 385 padding-left: 15px; 386 } 387 388 .shortcut-nav-one li:hover { 389 background: rgba(255, 255, 255, 0.4); 390 color: red; 391 } 392 393 .shortcut-nav-one li span { 394 float: right; 395 padding-right: 7px; 396 color: white; 397 font-family: "microsoft yahei"; 398 font-size: 14px; 399 } 400 401 .shortcut-nav-items { 402 width: 730px; 403 height: 44px; 404 float: left; 405 } 406 407 .shortcut-nav-items li { 408 float: left; 409 } 410 411 .shortcut-nav-items a { 412 display: inline-block; 413 height: 44px; 414 padding: 0 20px; 415 color: #333; 416 font: 400 16px/44px "microsoft yahei"; 417 } 418 419 .shortcut-nav-items a:hover { 420 color: #C81623; 421 } 422 423 .shortcut-nav-img { 424 width: 200px; 425 height: 44px; 426 float: right; 427 margin-top: -10px; 428 margin-right: 50px; 429 } 430 /*shortcut-nav结束*/ 431 /* sub-banner开始*/ 432 .sub-banner{ 433 position: relative; 434 } 435 .sub-banner a{ 436 position: absolute; 437 left: 0; 438 top:0; 439 display: block; 440 width:100%; 441 height:644px; 442 background:url(../img/subbanner.jpg)no-repeat center ; 443 444 } 445 /* sub-banner结束*/ 446 /*main开始*/ 447 .main{ 448 449 position:relative; 450 451 } 452 .main-slider { 453 float: left; 454 width: 730px; 455 height: 454px; 456 position: relative; 457 margin: 12px 0 0 220px; 458 } 459 460 .main-slider ul { 461 position: absolute; 462 left: 50%; 463 margin-left: -66px; 464 bottom: 10px; 465 } 466 467 .main-slider ul li { 468 float: left; 469 width: 18px; 470 height: 18px; 471 cursor: pointer; 472 text-align: center; 473 line-height: 18px; 474 border-radius: 50%; 475 margin: 0 2px; 476 background: #3E3E3E; 477 color: #fff; 478 } 479 480 .main-slider .current { 481 background: orangered; 482 } 483 484 .arrow a:hover { 485 background: rgba(0, 0, 0, .7); 486 } 487 488 .arrow a { 489 position: absolute; 490 top: 50%; 491 /*left: 0;*/ 492 width: 28px; 493 margin-top: -31px; 494 height: 62px; 495 /*border-radius:10px ;*/ 496 background: rgba(0, 0, 0, .3); 497 /*opacity:0.1;*/ 498 color: #fff; 499 text-align: center; 500 font: 400 22px/62px "simsun"; 501 } 502 503 .arrow-left { 504 left: 0; 505 border-radius: 0 10px 10px 0; 506 } 507 508 .arrow-right { 509 right: 0; 510 border-radius: 10px 0 0 10px; 511 } 512 513 .main-news { 514 float: right; 515 height: 451px; 516 width: 250px; 517 margin: 12px 0 5px 0; 518 } 519 520 .main-top { 521 border: 1px solid #E4E4E4; 522 } 523 524 .main-top-money { 525 height: 209px; 526 overflow: hidden; 527 } 528 529 .main-top-money ul { 530 width: 260px; 531 } 532 533 .main-top-money li { 534 width: 62px; 535 height: 70px; 536 float: left; 537 border: 1px solid #E8E8E7; 538 margin-top: -1px; 539 margin-left: -1px; 540 border-top: 0; 541 } 542 543 .main-top-money a { 544 position: relative; 545 display: block; 546 width: 62px; 547 height: 70px; 548 padding-top: 40px; 549 text-align: center; 550 line-height: 30px; 551 } 552 553 .main-top-money i { 554 position: absolute; 555 left: 18px; 556 top: 18px; 557 height: 25px; 558 width: 25px; 559 background: url(../img/fly.png) no-repeat; 560 } 561 562 .main-top-money .main-top-money-icon2 { 563 background-position: 0 -25px; 564 } 565 566 .main-top-money .main-top-money-icon3 { 567 background-position: 0 -50px; 568 } 569 570 .main-top-money .main-top-money-icon4 { 571 background-position: 0 -75px; 572 } 573 574 .main-top-money .main-top-money-icon5 { 575 background-position: 0 -100px; 576 } 577 578 .main-top-money .main-top-money-icon6 { 579 background-position: 0 -125px; 580 } 581 582 .main-top-money .main-top-money-icon7 { 583 background-position: 0 -150px; 584 } 585 586 .main-top-money .main-top-money-icon8 { 587 background-position: 0 -175px; 588 } 589 590 .main-top-money .main-top-money-icon9 { 591 background-position: 0 -250px; 592 } 593 594 .main-top-money .main-top-money-icon10 { 595 background-position: 0 -200px; 596 } 597 598 .main-top-money .main-top-money-icon11 { 599 background-position: 0 -275px; 600 } 601 602 .main-top-money .main-top-money-icon12 { 603 background-position: 0 -225px; 604 } 605 606 .main-top-money .hot { 607 position: absolute; 608 left: 41px; 609 top: 2px; 610 width: 20px; 611 height: 20px; 612 background: url(../img/china.png) no-repeat -197px -49px; 613 } 614 615 .main-news img { 616 margin-top: 5px; 617 } 618 619 .main-top-faster { 620 height: 163px; 621 border-bottom: 1px dashed #E4E4E4; 622 } 623 624 .main-top-faster-title { 625 height: 32px; 626 line-height: 32px; 627 padding: 0 15px; 628 border-bottom: 1px dotted #8E8EE7; 629 } 630 631 .main-top-faster-title h2 { 632 float: left; 633 font: 400 16px/32px "microsoft yahei"; 634 } 635 636 .main-top-faster-title a { 637 float: right; 638 } 639 640 .main-top-faster-content { 641 padding: 5px 0 0 15px; 642 } 643 644 .main-top-faster-content li { 645 line-height: 24px; 646 } 647 648 .main-top-faster-content span { 649 font-weight: 700; 650 margin-right: 5px; 651 } 652 /*today开始*/ 653 .today{ 654 /*margin:10px auto 20px ;*/ 655 position:relative; 656 padding:10px 0 20px; 657 } 658 .today-left{ 659 float: left; 660 } 661 .today-left{ 662 display:block; 663 width:210px; 664 height:151px; 665 background:rgb(88,76,78); 666 } 667 668 .today-right{ 669 position: relative; 670 width:1000px; 671 float: right; 672 overflow: hidden; 673 } 674 .today-right ul{ 675 width:410%; 676 } 677 .today-right li{ 678 float:left; 679 margin-right: 1px; 680 } 681 682 /*today结束*/ 683 684 685 /*footer开始*/ 686 687 .footer-top-slogen { 688 width: 100%; 689 height: 54px; 690 position: relative; 691 padding: 20px 0; 692 margin-bottom: 16px; 693 background: #F5F5F5; 694 } 695 696 .footer-top-slogen-img { 697 position: absolute; 698 /* top: 20px; */ 699 left: 50%; 700 } 701 702 .footer-top-shopping dl { 703 float: left; 704 width: 200px; 705 } 706 707 .footer-top-slogen-img1 { 708 margin-left: -604px; 709 } 710 711 .footer-top-slogen-img2 { 712 margin-left: -302px; 713 } 714 715 .footer-top-slogen-img4 { 716 margin-left: 302px; 717 } 718 719 .footer-top-shopping dt, 720 .coverage h3 { 721 height: 34px; 722 font: 400 16px/34px "microsoft yahei"; 723 } 724 725 .footer-top-shopping dd { 726 line-height: 20px; 727 } 728 729 .footer-top-shopping .last-dl { 730 width: 100px; 731 } 732 733 .coverage { 734 width: 186px; 735 height: 169px; 736 float: right; 737 margin-right: 60px; 738 padding-left: 17px; 739 background: url(../img/china.png) no-repeat left bottom; 740 } 741 742 .coverage p { 743 padding-top: 8px; 744 } 745 746 .coverage a { 747 float: right; 748 } 749 750 .footer-bottom { 751 margin-top: 20px; 752 padding: 20px 0 30px; 753 text-align: center; 754 border-top: 1px solid #E5E5E5; 755 } 756 757 .footer-bottom-links a { 758 margin: 0 10px; 759 } 760 761 .footer-bottom-copyright { 762 padding: 10px 0; 763 } 764 765 .footer-bottom-img a { 766 margin: 0 5px; 767 } 768 /*footer结束*/
浙公网安备 33010602011771号