精广告位小横幅图片代码分享-ACG资源社区

精广告位小横幅图片代码分享

2年前发布

0507120

小横幅图片广告演示：

图片[1]-广告位小横幅图片代码分享-其他技术论坛-资源分享：用户发帖区-爱好楼

1、广告代码：

<div class=“tengxuanw top-ad ad”>

<a href=“#” target=“_blank” rel=“nofollow noopener”><img src=“https://i.postimg.cc/CMvwjz7G/lianghao.png” /></a>

<a href=“#” target=“_blank” rel=“nofollow noopener”><img src=“http://www.tengxuanw.com/content/uploadfile/guanggao/jsj.png” /></a>

<a href=“#” target=“_blank” rel=“noopener”><img src=“https://thumbsnap.com/i/zPok35oF.gif?1031” /></a>

<a href=“#” target=“_blank” rel=“nofollow noopener”><img src=“https://thumbsnap.com/i/Exna3iTX.jpg?1028” /></a>

<a href=“#” target=“_blank” rel=“nofollow noopener”><img src=“https://thumbsnap.com/s/dYofjHNc.png?0122” /></a>

<a href=“#” target=“_blank” rel=“nofollow noopener”><img src=“https://thumbsnap.com/s/cxT1oa8U.jpg?0113” /></a>

<a href=“#” target=“_blank” rel=“nofollow noopener”><img src=“https://thumbsnap.com/i/ngrTBUuQ.jpg?1008” /></a>

<a href=“#” target=“_blank” rel=“nofollow noopener”><img src=“https://www.tengxuanw.com/content/uploadfile/guanggao/KBm5ekLg.png” /></a>

<a href=“#” target=“_blank” rel=“nofollow noopener”><img src=“https://thumbsnap.com/i/jxNYnZUF.jpg?0721” /></a>

<a href=“#” target=“_blank” rel=“nofollow noopener”><img src=“http://www.tengxuanw.com/content/uploadfile/guanggao/shoubiao.jpg” /></a>

<a href=“#” target=“_blank” rel=“nofollow noopener”><img src=“https://thumbsnap.com/i/apve4ona.jpg?0131” /></a>

<a href=“#” target=“_blank” rel=“nofollow noopener”><img src=“https://thumbsnap.com/i/jcVH5Van.png?0707” /></a></div>

2、CSS代码：

.top-ad {

padding: 10px 10px 6px;

display: flex;

flex-wrap: wrap;

margin-bottom: 10px;

background: #fff;

}

.top-ad>a {

width: calc((100% – 10px * 5) / 6);

margin-right: 10px;

height: 90px;

border-radius: 6px;

overflow: hidden;

margin-bottom: 10px;

transition: 0.2s all;

}

.top-ad>a:nth-child(6n) {

margin-right: 0;

}

.top-ad>a:hover {

transform: scale(1.05);

}

.top-ad>a>img {

width: 100%;

height: 100%;

display: block;

}

© 版权声明

文章版权归作者所有，未经允许请勿转载。

THE END

喜欢就支持一下吧

相关推荐

评论抢沙发

请登录后发表评论

暂无评论内容