Lexus-media/src/components/Footerbanner.vue

<template>
<div class="footer_banner">
    <div class="img">
        <img src="../img/footer-icon.png" alt="">
    </div>
    <div class="footer_link">
        <span >版权所有:2014-2016</span>
        <span>
            <a href="#">四维卓越信息咨询（北京）有限责任公司</a>
        </span>
        <span> | </span>
        <span>
            <a href="#">法律公告</a>
        </span>
        <span> | </span>
        <span>
            <a href="#">商业信息保护说明</a>
        </span>
        <span> | </span>
        <span>
            <a href="#">技术支持邮箱：lexus-dsms@siweizhuoyue.com</a>
        </span>
    </div>
</div>
</template>

<script>
export default {};
</script>

<style scoped lang="less">
.footer_banner{
    width: 1190px;
    height: 40px;
    margin: 0 auto;
    margin-top: 20px;
    background-color: #eee;
    border-top: 1px solid #ccc;
    font-size: 12px;
    display: flex;
    img{
        width: 151px;
        height: 23px;
        margin-top: 4px;
    }
    .footer_link{
        margin-top: 8px;
        margin-left: 10px;
        a{
            text-decoration: none;
            &:hover{
                color: #0056a0;
            }
        }
    }
}
</style>