image.png

  • 1号盒子是 mod_copyright 盒子,装2和3盒子,
  • 2号盒子用 a
  • 3号盒子直接写内容,然后 文字居中。

效果图
image.png

index.html

  1. <div class="mod_copyright">
  2. <div class="links">
  3. <a href="#">关于我们</a>|
  4. <a href="#">联系我们</a>|
  5. <a href="#">联系客服</a>|
  6. <a href="#">商家入驻</a>|
  7. <a href="#">营销中心</a>|
  8. <a href="#">手机品优购</a>|
  9. <a href="#">友情链接</a>|
  10. <a href="#">销售联盟</a>|
  11. <a href="#">品优购社区</a>|
  12. <a href="#">品优购公益</a>|
  13. <a href="#">English Site</a>|
  14. <a href="#">Contact U</a>|
  15. </div>
  16. <div class="copyright">
  17. 地址:北京市昌平区建材城西路金燕龙办公楼一层 邮编:100096 电话:400-618-4000 传真:010- 82935100 邮箱: zhanghj+itcast.cn <br>
  18. 京ICP备08001421号京公网安备110108007702
  19. </div>
  20. </div>

common.css

.footer .mod_copyright {
  padding-top: 15px;
  text-align: center;
}

.footer .mod_copyright .links {
  margin-bottom: 10px;
}

.footer .mod_copyright .links a {
  padding: 0 10px;
}

.footer .mod_copyright .copyright {
  line-height: 20px;
}