分享一个网站推荐位置源码，资源网娱乐网广告源码

分享一个网站推荐位置源码 互换广告，提高知名度

pc端显示，wp端隐藏

演示

源码

html部分

[lv]

<div class="index-rank ad">
    <ul class="layui-clear">
        <li>
            <a href="https://m.qqzy8.com/" rel="nofollow" target="_blank" class="tit layui-clear">
                <img class="lazy" src="https://m.qqzy8.com/favicon.ico" alt="QQ资源吧-学习技术 从这里开始">QQ资源吧</a>
        </li>
        <li>
            <a href="https://m.qqzy8.com/" rel="nofollow" target="_blank" class="tit layui-clear">
                <img class="lazy" src="https://m.qqzy8.com/favicon.ico" alt="QQ资源吧-学习技术 从这里开始">QQ资源吧</a>
        </li>
        <li>
            <a href="https://m.qqzy8.com/" rel="nofollow" target="_blank" class="tit layui-clear">
                <img class="lazy" src="https://m.qqzy8.com/favicon.ico" alt="QQ资源吧-学习技术 从这里开始">QQ资源吧 </a>
        </li>
        <li>
            <a href="https://m.qqzy8.com/" rel="nofollow" target="_blank" class="tit layui-clear">
                <img class="lazy" src="https://m.qqzy8.com/favicon.ico" alt="QQ资源吧-学习技术 从这里开始">QQ资源吧</a>
        </li>
        <li>
            <a href="https://m.qqzy8.com/" rel="nofollow" target="_blank" class="tit layui-clear">
                <img class="lazy" src="https://m.qqzy8.com/favicon.ico" alt="QQ资源吧-学习技术 从这里开始">QQ资源吧</a>
        </li>
        <li>
            <a href="https://m.qqzy8.com/" rel="nofollow" target="_blank" class="tit layui-clear">
                <img class="lazy" src="https://m.qqzy8.com/favicon.ico" alt="QQ资源吧-学习技术 从这里开始">QQ资源吧 </a>
        </li>
    </ul>
</div>

[/lv]

css部分

[lv]

    .index-rank {
        margin: 10px 0 10px;
        background: #fff;
        padding: 10px;
        box-sizing: border-box;
    }

    .layui-clear {
        clear: both;
    }

    .index-rank li:nth-child(1n) {
        float: right;
        margin-right: 0;
    }

    .index-rank li {
        float: left;
        width: 185px;
        margin: 5px 15px 5px 0;
        overflow: hidden;
        padding: 10px;
        box-sizing: border-box;
        line-height: 20px;
    }

    .index-rank li a {
        display: block;
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
    }

    .layui-clear {
        clear: both;
    }

    .index-rank li img {
        display: block;
        height: 20px;
        width: 20px;
        float: left;
        margin-right: 5px;
        border-radius: 5px;
    }

    @media screen and (max-width: 600px) {
        div.index-rank {
            display: none;
        }
    }

[/lv]