最新一款115资源网中部装饰布局html+css代码，淘宝优惠价、天猫优惠价、拼多多优惠价，中部装饰布局代码

温馨提示：本文最后更新于2019年3月15日 16:20，若内容或图片失效，请在下方留言或联系博主。

摘要

说实话这个东西挺好看的，喜欢的就拿去，使用方法和代码都在下面打出来了。

HTML代码：

<ul class="index-add">
    <li><img src="http://www.kuaizh.cn//content/templates/meta/images/tubiao1.png">
    <div>
        <...

说实话这个东西挺好看的，喜欢的就拿去，使用方法和代码都在下面打出来了。

HTML代码：

<ul class="index-add">
    <li><img src="http://www.kuaizh.cn//content/templates/meta/images/tubiao1.png">
    <div>
        <h3>这是一个标题</h3>
        <span>这是一个简介</span>
    </div>
    <a href="#" rel="nofollow" target="_blank" class="go">查看</a></li>
    <li><img src="http://www.kuaizh.cn//content/templates/meta/images/tubiao2.png">
    <div>
        <h3>这是一个标题</h3>
        <span>这是一个简介</span>
    </div>
    <a href="#" rel="nofollow" target="_blank" class="go">查看</a></li>
    <li><img src="http://www.kuaizh.cn//content/templates/meta/images/tubiao3.png">
    <div>
        <h3>这是一个标题</h3>
        <span>这是一个简介</span>
    </div>
    <a href="#" class="go" rel="nofollow" target="_blank">查看</a></li>
</ul>

CSS代码：

.index-add{overflow:hidden;margin-top:15px;padding:15px;background:#fff;margin-top:10px;margin-bottom:10px}
.index-add li{float:left;margin-right:5%;width:30%}
.index-add li:nth-child(3){margin-right:0}
.index-add li img{float:left;margin-right:15px;width:52px;height:52px;border-radius:10px}
.index-add li div{float:left;width:calc(100% - 52px - 25px - 75pt - 25px)}
.index-add li div h3{color:#333;font-size:15px}
.index-add li div h3,.index-add li div span{display:block;overflow:hidden;height:26px;text-overflow:ellipsis;white-space:nowrap;line-height:26px}
.index-add li div span{color:#a9a9a9;font-size:14px}
.index-add li .go{float:right;margin-top:8.5px;margin-left:25px;width:70pt;height:35px;border:1px solid #ededed;border-radius:20px;color:#ababab;text-align:center;line-height:32px;transition:.2s all}

使用说明：

1、首先复制上面html代码，粘贴到你网站适合的位置。

2、随后复制上面CSS代码，粘贴在你网站调用的css文件里，

3、保存文件，清理缓存，刷新网站，即可。

如按上面流程完成不了，可以加站长免费提供服务哟！

标签：网站源码网站代码