WordPress网站两种表格广告位美化代码

摘要目录

第一种方案

<div class="textwidget custom-html-widget"><table style="width:100%;font-weight:700;text-align:center;" cellspacing="0" cellpadding="0" bordercolor="#640EF6" border="1">
<tbody>
<tr>
<td style="width:20%;vertical-align:middle;">
<a href="https://ds17.cn" target="_blank" rel="noopener"><span style="font-size:13px;color:#E53333;">广告位10/月&lt;/span></a> 
</td>
<td style="width:20%;vertical-align:middle;" height="24">
<a href="https://ds17.cn" target="_blank" rel="noopener"><span style="font-size:13px;color:#E53333;">广告位10/月</span></a> 
</td>
<td style="width:20%;vertical-align:middle;" height="24">
<a href="https://ds17.cn" target="_blank" rel="noopener"><span style="font-size:13px;color:#337FE5;">老白博客</span></a> 
</td>
<td style="width:20%;vertical-align:middle;" height="24">
<a href="https://ds17.cn" target="_blank" rel="noopener"><span style="font-size:13px;color:#E53333;">广告位10/月</span></a> 
</td>
<td style="width:20%;vertical-align:middle;" height="24">
<a href="https://ds17.cn" target="_blank" rel="noopener"><span style="font-size:13px;color:#E53333;">广告位10/月</span></a> 
</td>
</tr>
<tr>
<td style="width:20%;vertical-align:middle;">
<a href="https://ds17.cn"target="_blank" rel="noopener"><span style="font-size:13px;color:#640EF6;">大神ds17.cn</span></a> 
</td>
<td style="width:20%;vertical-align:middle;" height="24">
<a href="https://ds17.cn"target="_blank" rel="noopener"><span style="font-size:13px;color:#E53333;">广告位10/月</span></a> 
</td>
<td style="width:20%;vertical-align:middle;" height="24">
<a href="https://ds17.cn" target="_blank" rel="noopener"><span style="font-size:13px;color:#E53333;">广告位10/月</span></a> 
</td>
<td style="width:20%;vertical-align:middle;">
<a href="https://ds17.cn" target="_blank" rel="noopener"><span style="font-size:13px;color:#640EF6;">广告位10/月</span></a> 
</td>
<td style="width:20%;vertical-align:middle;">
<a href="https://ds17.cn" target="_blank" rel="noopener"><span style="font-size:13px;color:#640EF6;">广告位10/月</span></a> 
</td>
</tr>
<tr>
<td style="width:20%;vertical-align:middle;">
<a href="https://ds17.cn"target="_blank" rel="noopener"><span style="font-size:13px;color:#640EF6;">广告位10/月</span></a> 
</td>
<td style="width:20%;vertical-align:middle;" height="24">
<a href="https://ds17.cn" target="_blank" rel="noopener"><span style="font-size:13px;color:#640EF6;">广告位10/月</span></a> 
</td>
<td style="width:20%;vertical-align:middle;" height="24">
<a href="https://ds17.cn" target="_blank" rel="noopener"><span style="font-size:13px;color:#640EF6;">广告位10/月</span></a> 
</td>
<td style="width:20%;vertical-align:middle;">
<a href="https://ds17.cn" target="_blank" rel="noopener"><span style="font-size:13px;color:#640EF6;">广告位10/月</span></a> 
</td>
<td style="width:20%;vertical-align:middle;">
<a href="https://ds17.cn" target="_blank" rel="noopener"><span style="font-size:13px;color:#640EF6;">广告位10/月</span></a> 
</td>
</tr>
<tr>
<td style="width:20%;vertical-align:middle;">
<a href="https://ds17.cn" target="_blank" rel="noopener"><span style="font-size:13px;">老白博客</span></a> 
</td>
<td style="width:20%;vertical-align:middle;">
<a href="https://ds17.cn" target="_blank" rel="noopener"><span style="font-size:13px;">广告位10/月</span></a> 
</td>
<td style="width:20%;vertical-align:middle;">
<a href="https://ds17.cn" target="_blank" rel="noopener"><span style="font-size:13px;">广告位10/月</span></a> 
</td>
<td style="width:20%;vertical-align:middle;">
<a href="https://ds17.cn" target="_blank" rel="noopener"><span style="font-size:13px;">广告位10/月</span></a> 
</td>
<td style="width:20%;vertical-align:middle;">
<a href="https://ds17.cn" target="_blank" rel="noopener"><span style="font-size:13px;">广告位10/月</span></a> 
</td>
</tr>
<tr>
<td style="width:20%;vertical-align:middle;">
<a href="https://ds17.cn" target="_blank" rel="noopener"><span style="font-size:13px;">广告位10/月</span></a> 
</td>
<td style="width:20%;vertical-align:middle;">
<a href="https://ds17.cn" target="_blank" rel="noopener"><span style="font-size:13px;color:#E53343;">广告位10/月</span></a> 
</td>
<td style="width:20%;vertical-align:middle;">
<a href="https://ds17.cn" target="_blank" rel="noopener"><span style="font-size:13px;color:#E53343;">广告位10/月</span></a> 
</td>
<td style="width:20%;vertical-align:middle;">
<a href="https://ds17.cn" target="_blank" rel="noopener"><span style="font-size:13px;">广告位10/月</span></a> 
</td>
<td style="width:20%;vertical-align:middle;">
<a href="https://ds17.cn" target="_blank" rel="noopener"><span style="font-size:13px;">广告位10/月</span></a> 
</td>
</tr>
<tr>
<td colspan="5" style="font-size:15px;" height="28">
<p>
<script type="text/javascript">(function(){document.write(unescape('%3Cdiv id="bdcs"%3E%3C/div%3E'));var bdcs = document.createElement('script');bdcs.type = 'text/javascript';bdcs.async = true;bdcs.src = 'http://znsv.baidu.com/customer_search/api/js?sid=1152302146349204199' + '&plate_url=' + encodeURIComponent(window.location.href) + '&t=' + Math.ceil(new Date()/3600000);var s = document.getElementsByTagName('script')[0];s.parentNode.insertBefore(bdcs, s);})();</script></p><div id="bdcs"></div><marquee scrollamount="3" behavior="alternate">温馨提示：需广告位请联系大神博客ds17.cn </marquee>
<p></p>
</td>
</tr>
</tbody>
</table></div>

第二种方案

<style type="text/css">.tp-ad-text1 {
    width: 100%;
    padding-top: 6px;
    box-sizing: border-box;
    overflow: hidden;
    background: rgba(255, 255, 255, .2);
}

.tp-ad-text1 a {
    color: #7fba00;
    font-size: 14px;
    line-height: 38px;
    text-align: center;
    border: 1px dashed rgba(0, 0, 0, .2);
    padding: 0 3px;
    box-sizing: border-box;
    float: left;
    width: 11.5%;
    height: 38px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin: 0 0.5% 6px;
    text-decoration: none;
    transition: all .6s;
}

.tp-ad-text1 a:hover {
    font-weight: bold;
    color: #fff !important;
    background: #7fba00;
    transition: all .6s;
}

.tp-ad-text1 a:nth-child(2n) {
    color: #f74e1e;
}

.tp-ad-text1 a:nth-child(2n):hover {
    background: #f74e1e;
    border-color: #f74e1e;
}

.tp-ad-text1 a:nth-child(3n) {
    color: #00a4ef;
}

.tp-ad-text1 a:nth-child(3n):hover {
    background: #00a4ef;
    border-color: #00a4ef;
}

.tp-ad-text1 a:nth-child(4n) {
    color: #0517c2;
}

.tp-ad-text1 a:nth-child(4n):hover {
    background: #0517c2;
    border-color: #0517c2;
}

.tp-ad-text1 a:nth-child(5n) {
    color: #601165;
}

.tp-ad-text1 a:nth-child(5n):hover {
    background: #601165;
    border-color: #601165;
}

.tp-ad-text1 a:nth-child(6n) {
    color: #ffb900;
}

.tp-ad-text1 a:nth-child(6n):hover {
    background: #ffb900;
    border-color: #ffb900;
}

.tp-ad-text1 a:nth-child(7n) {
    color: #0fc317;
}

.tp-ad-text1 a:nth-child(7n):hover {
    background: #0fc317;
    border-color: #0fc317;
}

.tp-ad-text1 a:nth-child(8n) {
    color: #601165;
}

.tp-ad-text1 a:nth-child(8n):hover {
    background: #601165;
    border-color: #601165;
}

.tp-ad-text1 a:nth-child(9n) {
    color: #fba78f;
}

.tp-ad-text1 a:nth-child(9n):hover {
    background: #fba78f;
    border-color: #fba78f;
}

.tp-ad-text1 a:nth-child(10n) {
    color: #13cf8f;
}

.tp-ad-text1 a:nth-child(10n):hover {
    background: #13cf8f;
    border-color: #13cf8f;
}

.tp-ad-text1 a:nth-child(11n) {
    color: #f74e1e;
}

.tp-ad-text1 a:nth-child(11n):hover {
    background: #f74e1e;
    border-color: #f74e1e;
}

.tp-ad-text1 a:nth-child(12n) {
    color: #ffb900;
}

.tp-ad-text1 a:nth-child(12n):hover {
    background: #ffb900;
    border-color: #ffb900;
}

.tp-ad-text1 a:nth-child(13n) {
    color: #fba78f;
}

.tp-ad-text1 a:nth-child(13n):hover {
    background: #fba78f;
    border-color: #fba78f;
}

.tp-ad-text1 a:nth-child(14n) {
    color: #f74e1e;
}

.tp-ad-text1 a:nth-child(14n):hover {
    background: #f74e1e;
    border-color: #f74e1e;
}

.tp-ad-text1 a:nth-child(15n) {
    color: #7fba00;
}

.tp-ad-text1 a:nth-child(15n):hover {
    background: #7fba00;
    border-color: #7fba00;
}

.tp-ad-text1 a:nth-child(16n) {
    color: #0fc317;
}

.tp-ad-text1 a:nth-child(16n):hover {
    background: #0fc317;
    border-color: #0fc317;
}

.tp-ad-text1 a:nth-child(17n) {
    color: #0517c2;
}

.tp-ad-text1 a:nth-child(17n):hover {
    background: #0517c2;
    border-color: #0517c2;
}

.tp-ad-text1 a:nth-child(18n) {
    color: #13cf8f;
}

.tp-ad-text1 a:nth-child(18n):hover {
    background: #13cf8f;
    border-color: #13cf8f;
}

.tp-ad-text1 a:nth-child(19n) {
    color: #ffb900;
}

.tp-ad-text1 a:nth-child(19n):hover {
    background: #ffb900;
    border-color: #ffb900;
}

.tp-ad-text1 a:nth-child(20n) {
    color: #f74e1e;
}

.tp-ad-text1 a:nth-child(20n):hover {
    background: #f74e1e;
    border-color: #f74e1e;
}

@media screen and (max-width: 1198px) {
    .tp-ad-text1 a {
        width: 24%;
    }
}

</style>乐搜社区广告代码 <div class="tp-ad-text1"><a href="https://ds17.cn" title="乐搜源码" target="_blank">乐搜社区</a><a href="https://ds17.cn" title="广告位/10/月" target="_blank">同款网站搭建</a><a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a><a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a><a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a><a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a><a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a><a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a><a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a><a href="https://ds17.cn" title="广告位/10/月" target="_blank" title="同款网站搭建" target="_blank">同款网站搭建</a><a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a><a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a><a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a><a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a><a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a><a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a><a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a><a href="https://ds17.cn" title="同款网站搭建" target="_blank">同款网站搭建</a><a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a><a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a><a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a><a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a><a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a><a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a></div>

自用修改代码

<style>
.tp-ad-text1 {
    width: 100%;
    padding-top: 6px;
    box-sizing: border-box;
    overflow: hidden;
    background: rgba(255, 255, 255, .2);
}

.tp-ad-text1 a {
    color: #7fba00;
    font-size: 12px;
    line-height: 30px;
    text-align: center;
    border: 1px dashed rgba(0, 0, 0, .2);
    padding: 0 0px;
    box-sizing: border-box;
    float: left;
    width: 24%;
    height: 30px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin: 0 0.5% 6px;
    text-decoration: none;
    transition: all .6s;
}

@media screen and (max-width: 1198px) {
    .tp-ad-text1 a {
        width: 32%;
    }
}
</style>

<div class="tp-ad-text1">
<a href="https://ds17.cn" title="乐搜源码" target="_blank">乐搜社区</a>
<a href="https://ds17.cn" title="广告位/10/月" target="_blank">同款网站搭建</a>
<a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a>
<a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a>
<a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a>
<a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a>
<a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a>
<a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a>
<a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a>
<a href="https://ds17.cn" title="广告位/10/月" target="_blank">同款网站搭建</a>
<a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a>
<a href="https://ds17.cn" title="广告位/10/月" target="_blank">广告位/10/月</a>
</div>

WordPress网站两种表格广告位美化代码

第一种方案

第二种方案

自用修改代码

相关文章

分类文章

最新文章

热门标签