精美图文广告代码

请看效果图 :

image.png

代码如下:

<div class="col">
 <div class="card">

</div>
<!--图片广告区域开始-->
<div style="background-color:#fff;box-shadow:0px 0px 10px #dedede;padding:5px;margin-top:5px;margin-bottom:5px;">
 <a class="adplan" data-id="15" style="display:block;width:100%;margin-bottom:10px;" rel="nofollow" target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=1060848486&site=qq&menu=yes" title="广告联系q:1060848486|过期时间:永久"> <img src="https://www.99ika.cn/gg.png" style="max-height:70px;width:100%;border-radius:4px;" width="644" height="70" title="" align="" alt="" />
  <a href="http://dg.99ika.cn" rel="nofollow" target="_blank" title="点击进入"><img src="https://s3.ax1x.com/2020/12/29/rbSF0J.gif" width="100%" alt="点击进入"></a>
</a> <!--图片广告区域结束-->	
			 		        <!--顶部双排广告第二行-->
<style>
    #nr{
    	font-size:20px;
    	margin: 0;
        background: -webkit-linear-gradient(left,
            #ffffff,
            #ff0000 6.25%,
            #ff7d00 12.5%,
            #ffff00 18.75%,
            #00ff00 25%,
            #00ffff 31.25%,
            #0000ff 37.5%,
            #ff00ff 43.75%,
            #ffff00 50%,
            #ff0000 56.25%,
            #ff7d00 62.5%,
            #ffff00 68.75%,
            #00ff00 75%,
            #00ffff 81.25%,
            #0000ff 87.5%,
            #ff00ff 93.75%,
            #ffff00 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-size: 200% 100%;
        animation: masked-animation 2s infinite linear;
    }
    @keyframes masked-animation {
        0% {
            background-position: 0 0;
        }
        100% {
            background-position: -100%, 0;
        }
    }
   
</style>
	<div style="background-color:#333;border-radius:25px;box-shadow:0px 0px 5px #f200ff;padding:5px;margin-top:10px;margin-bottom:0px;">
		<marquee>
    	<b id="nr">公告:欢迎来到自动秒收录网! </b> </marquee>
	</div>
<!--顶部双排广告第二行-->
<style>
.txtguanggao{width: 100%;overflow: hidden;display: block;box-shadow: 0 1px 2px 0 rgba(0,0,0,.05);}.txtguanggao a{width: 24.5%;float: left;border-radius: 2px;line-height: 35.35px;height: 35.35px;text-align: center;font-size: 14px;color: #fff;display: inline-block;background-color: rgb(255, 153, 159);margin: 2.5px;transition-duration: .3s;}.txtguanggao a:nth-child(1) {background-color: #dc3545;}.txtguanggao a:nth-child(2) {background-color: #007bff;}.txtguanggao a:nth-child(3) {background-color: #28a745;}.txtguanggao a:nth-child(4) {background-color: #ffc107;}.txtguanggao a:nth-child(5) {background-color: #28a745;}.txtguanggao a:nth-child(6) {background-color: #ffc107;}.txtguanggao a:nth-child(7) {background-color: #dc3545;}.txtguanggao a:nth-child(8){background-color: #007bff;}.txtguanggao a:hover{background:#FF2805;color:#FFF}@media screen and (max-width: 1000px) {.txtguanggao a{width: 47.96%;float: left;border-radius: 2px;line-height: 35.35px;height: 35.35px;text-align: center;font-size: 14px;color: #fff;display: inline-block;background-color: rgb(255, 153, 159);margin: 2.5px;transition-duration: .3s;}}
  </style>
	<div class="txtguanggao">
		<a href="http://dg.99ika.cn" target="_blank" rel="nofollow" class="dh">免费QQ呆瓜</a> <a href="http://dg.99ika.cn" target="_blank" rel="nofollow" class="dh">文字广告热销中</a> <a href="http://wpa.qq.com/msgrd?v=3&uin=1060848486&site=qq&menu=yes" target="_blank" rel="nofollow" class="dh">文字广告热销中</a> <a href="http://wpa.qq.com/msgrd?v=3&uin=1060848486&site=qq&menu=yes" target="_blank" rel="nofollow" class="dh">文字广告热销中</a> <a href="http://wpa.qq.com/msgrd?v=3&uin=1060848486&site=qq&menu=yes" target="_blank" rel="nofollow" class="dh">文字广告热销中</a> <a href="http://wpa.qq.com/msgrd?v=3&uin=1060848486&site=qq&menu=yes" target="_blank" rel="nofollow" class="dh">文字广告热销中</a> <a href="http://wpa.qq.com/msgrd?v=3&uin=1060848486&site=qq&menu=yes" target="_blank" rel="nofollow" class="dh">文字广告热销中</a> <a href="http://wpa.qq.com/msgrd?v=3&uin=1060848486&site=qq&menu=yes" target="_blank" rel="nofollow" class="dh">文字广告热销中</a>
	</div>
</div>
<!--文字广告结束-->
 
 </div>
CTRL+D快速收藏,欢迎常来喔

未经允许不得转载:作者: 小久, 转载或复制请以 超链接形式 并注明出处 久久博客
原文地址: 《精美图文广告代码》 发布于2021年4月6日

本文链接:精美图文广告代码 - https://blog.99ika.cn/jsjc/262.html

本文标签:

相关推荐
发表评论
0 评论
还没有评论,快来抢沙发吧!
576Sitemap