CSS-仿京东底部导航栏（二）

现在的我们考虑车子、房子、职业、背景，却唯独少了爱情。一位朋友说或许是年龄越大，越来越难遇见心动的人。也有可能是经历了越来越多的事情之后，逐渐开始把自己包装起来，不愿意再去经历之前的痛苦，即便遇到自己喜欢的人和事。人生一世，殊为不易，何不放开手脚大胆做事，为何要被自己的内心所束缚呢？

CSS-仿京东底部导航栏（二）

要点：
文字之间行间距可以使用line-height 设置高度

效果如下：

/*底部帮助模块*/
.mod_help{
    height: 185px;
    padding-top: 20px;
    padding-left: 50px;
    border-bottom: 1px solid #cccccc;
}
.mod_help dl dt{
    font-size: 16px;
    margin-bottom: 10px;
}
.mod_help dl{
    float: left;
    width: 200px;
}
.mod_help dl:last-child{
    width: 90px;
    text-align: center;
}
.mod_help dl img{
    display: inline-block;
    width: 100px;
    height: 100px;
    /*background-size: 100%;*/
}
/*版权模块*/
.mod_copyright{
    text-align: center;
    padding-top: 10px;
}
.link{
    padding-bottom: 10px;
}
.link a{
    padding: 0 3px;
}
.copyright{
    line-height: 20px;
}

 <div class="mod_help">
            <dl>
                <dt>服务指南</dt>
                <dd><a href="#">购物流程</a></dd>
                <dd><a href="#">会员介绍</a></dd>
                <dd><a href="#">生活旅行</a></dd>
                <dd><a href="#">常见问题</a></dd>
                <dd><a href="#">大家电</a></dd>
                <dd><a href="#">联系客服</a></dd>
            </dl>
            <dl>
                <dt>服务指南</dt>
                <dd><a href="#">购物流程</a></dd>
                <dd><a href="#">会员介绍</a></dd>
                <dd><a href="#">生活旅行</a></dd>
                <dd><a href="#">常见问题</a></dd>
                <dd><a href="#">大家电</a></dd>
            </dl>
            <dl>
                <dt>服务指南</dt>
                <dd><a href="#">购物流程</a></dd>
                <dd><a href="#">会员介绍</a></dd>
                <dd><a href="#">生活旅行</a></dd>
                <dd><a href="#">常见问题</a></dd>
                <dd><a href="#">大家电</a></dd>
            </dl>
            <dl>
                <dt>服务指南</dt>
                <dd><a href="#">购物流程</a></dd>
                <dd><a href="#">会员介绍</a></dd>
                <dd><a href="#">生活旅行</a></dd>
                <dd><a href="#">常见问题</a></dd>
                <dd><a href="#">大家电</a></dd>
            </dl>
            <dl>
                <dt>服务指南</dt>
                <dd><a href="#">购物流程</a></dd>
                <dd><a href="#">会员介绍</a></dd>
                <dd><a href="#">生活旅行</a></dd>
                <dd><a href="#">常见问题</a></dd>
                <dd><a href="#">大家电</a></dd>
            </dl>
            <dl>
                <dt>帮助中心</dt>
                <img src="image/wz.jpg" alt="#">
                王子商城
            </dl>
        </div>
        <div class="mod_copyright">
            <div class="link">
                <a href="">关于我们</a>|
                <a href="">联系我们</a>|
                <a href="">联系客服</a>|
                <a href="">商家入驻</a>|
                <a href="">友情链接</a>
            </div>
            <div class="copyright">
                地址：山西省晋中市榆次区王子小区王子商业街一号   邮编：000000
                电话：400-600-8888   邮箱：王子@zuishuai.com <br>
                备案号110289384923423
            </div>
        </div>