统计
  • 建站日期:2022-01-17
  • 文章总数:5712 篇
  • 评论总数:54391条
  • 分类总数:43 个
  • 最后更新:1天前

图片广告位代码/单排长图广告与双排图片广告代码

作者头像
首页 建站技术 正文
广告
广告

image.png

 

Hello,大家好,之前写过很多各式各样的文字广告位代码,也都给大家免费分享了,也得到大家的一致好评,站长微信群一位站长需要图片广告位代码,就是长图一排展示或者一排展示两个的,这个刚好之前就写好了 ,不过一直懒得发布,今天勤快一下吧。

HTML代码如下

<div class="tp-ads">
  <div class="tp-ads-list">
    <a href="https://www.aybk.cn/" target="_blank" title="" alt="">
      <img src="https://www.aybk.cn/content/uploadfile/202304/b8f51681450097.gif" alt="">
    </a>
  </div>
  <div class="tp-ads-list tp-ads-flex">
    <a href="https://www.aybk.cn/" target="_blank" title="" alt="">
      <img src="https://www.aybk.cn/content/uploadfile/202304/b8f51681450097.gif" alt="">
    </a>
    <a href="https://www.aybk.cn/" target="_blank" title="" alt="">
      <img src="https://www.aybk.cn/content/uploadfile/202304/b8f51681450097.gif" alt="">
    </a>
  </div>
  <div class="tp-ads-list tp-ads-flex">
    <a href="https://www.aybk.cn/" target="_blank" title="" alt="">
      <img src="https://www.aybk.cn/content/uploadfile/202304/b8f51681450097.gif" alt="">
    </a>
    <a href="https://www.aybk.cn/" target="_blank" title="" alt="">
      <img src="https://www.aybk.cn/content/uploadfile/202304/b8f51681450097.gif" alt="">
    </a>
  </div>

 

 

 

 

 

 

</div>
CSS代码如下

<style type="text/css">
.tp-ads{
width: 100%;
margin-top: 6px;
}
.tp-ads-list{
width: 100%;
}
.tp-ads-list a{
display: block;
width: 100%;
}
.tp-ads-list img{
width: 100%;
height: 70px;
margin: 4px 0;
}
.tp-ads-flex{
display: flex;
align-items: center;
justify-content: space-between;
}
.tp-ads-flex a{
width: 49.8%;
}

@media screen and (max-width: 1000px){
.tp-ads-list img{
width: 100%;
height: 25px;
}
}
</style>

 

版权说明
文章采用: 《署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0)》许可协议授权。
版权声明:本站资源来自互联网收集,仅供用于学习和交流,请勿用于商业用途。如有侵权、不妥之处,请联系客服并出示版权证明以便删除!
抖快助手1.2/自动刷视频
« 上一篇 04-26
球球大作战吐球加速直装破解
下一篇 » 04-26

发表评论

  • 泡泡
  • 阿呆
  • 阿鲁
  • 蛆音娘
    没有更多评论了