图片广告代码wp子比主题美化四

图片代码比较简单,放置位置随意放置即可。

<img src="https://llzi.cn/wp-content/uploads/2023/03/21.gif"width="100%">

 

再下面的就是文字广告了,文字随便改,带背景颜色比较醒目,可以随意增加多少条都没关系。但是文字代码需要配合css代码使用哦。直接看代码吧。

<div class="wzgg">
<a href="链接地址放这里" target="_blank">双 端 显 示</a> 
<a href="链接地址放这里" target="_blank">显 眼 醒 目</a> 
<a href="链接地址放这里" target="_blank">一 坑 一 个</a> 
<a href="链接地址放这里" target="_blank">火 爆 招 募 中 !</a> 
<a href="链接地址放这里" target="_blank">这里有位置</a> 
<a href="链接地址放这里" target="_blank">这里有位置</a> 
<a href="链接地址放这里" target="_blank">这里有位置</a> 
<a href="链接地址放这里" target="_blank">这里有位置</a>
</div>

文字广告的css代码相信大家自己都知道放哪了。放自定义css即可

/*文字广告 开始*/
.wzgg{width: 100%;overflow: hidden;display: block;box-shadow: 0 1px 2px 0 rgba(0,0,0,.05);}.wzgg a{width: 24.4%;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;}.wzgg a:nth-child(1) {background-color: #dc3545;}.wzgg a:nth-child(2) {background-color: #007bff;}.wzgg a:nth-child(3) {background-color: #28a745;}.wzgg a:nth-child(4) {background-color: #ffc107;}.wzgg a:nth-child(5) {background-color: #28a745;}.wzgg a:nth-child(6) {background-color: #ffc107;}.wzgg a:nth-child(7) {background-color: #dc3545;}.wzgg a:nth-child(8){background-color: #007bff;}.wzgg a:hover{background:#FF2805;color:#FFF}@media screen and (max-width: 1000px) {.wzgg 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;}}
/*文字广告 结束*/
© 版权声明
THE END
喜欢就支持一下吧
点赞7 分享
评论 抢沙发
头像
欢迎您留下宝贵的见解!
提交
头像

昵称

取消
昵称表情代码图片

    暂无评论内容