双列自适应 广告代码 可横幅 可文字 代码分享

2024-09-19 0 315

双列自适应 广告代码 可横幅 可文字 代码分享,好久好久之前发布在其他已出售的网站上的,因原网站代码失效,所以重新发一次,方便小伙伴们使用。
双列自适应 广告代码 可横幅 可文字 代码分享

HTML代码:

  1. <div class=“ad”>
  2. <!–图片横幅广告–>
  3. <a href=“https://www.azyb.cn/” target=“_blank”><img src=“图片地址”></a>
  4. <!–自适应文字广告–>
  5. <div class=“zuo text-ad”><a href=“https://www.azyb.cn/” target=” _blank”=“” style=“background:#01AAED;”>广告招商虚位以待</a></div>
  6. <div class=“you text-ad”><a href=“https://www.azyb.cn/” target=” _blank”=“” style=“background:#2F4056;”>广告招商虚位以待</a></div>
  7. </div>

CSS代码:

  1. /**广告位CSS**/
  2. .ad {
  3. background: #fff;
  4. overflow: hidden;
  5. clear: both;
  6. margin: 10px 0 0;
  7. padding: 8px;
  8. }
  9. .ad img {
  10. max-width: 100%;
  11. }
  12. .ad .text-ad {
  13. width: 50%;
  14. }
  15. .ad .text-ad a {
  16. margin: 6px 0 0;
  17. display: block;
  18. height: 60px;
  19. line-height: 60px;
  20. color: #fff;
  21. font-size: 24px;
  22. text-align: center;
  23. }
  24. .zuo {
  25. float: left;
  26. }
  27. .you {
  28. float: right;
  29. }
  30. @media(max-width:999px) {
  31. .ad .text-ad {
  32. width: 100%;
  33. }
  34. }
    收藏 (0) 打赏

    感谢您的支持,我会继续努力的!

    打开微信扫一扫,即可进行扫码打赏哦,分享从这里开始,精彩与您同在
    点赞 (0)

    版权声明 1 本网站名称:爱资源吧-分享有价值的资源
    2 本站永久网址:https://www.azyb.cn/
    3 本网站的文章部分内容可能来源于网络,仅供大家学习与参考,如有侵权,请联系站长 QQ275559997进行删除处理。
    4 本站一切资源不代表本站立场,并不代表本站赞同其观点和对其真实性负责。
    5 本站一律禁止以任何方式发布或转载任何违法的相关信息,访客发现请向站长举报
    6 本站提供的一切软件、教程和内容信息仅限用于学习和研究目的;不得将上述内容用于商业或者非法用途,否则,一切后果请用户自负。
    7 本站信息来自网络收集整理,版权争议与本站无关。您必须在下载后的24个小时之内,从您的电脑或手机中彻底删除上述内容。
    8 如果您喜欢该程序和内容,请支持正版,购买注册,得到更好的正版服务。我们非常重视版权问题,如有侵权请邮件与我们联系处理。敬请谅解!
    9 本站资源大都存储在云盘,如发现链接失效,请联系我们我们会第一时间更新。
    10 如无特别声明本文即为原创文章仅代表个人观点,版权归《爱资源吧》所有,欢迎转载,转载请保留原文链接。

    爱资源吧-综合优质网络资源收集分享-提供最新最全的资源下载 技术教程 双列自适应 广告代码 可横幅 可文字 代码分享 https://www.azyb.cn/jishu/2066.html/

    发表评论
    暂无评论