Question

这样做的最佳方法是什么？我想在网站上实际应用图片广告的photoshop式彩色叠加层。最好通过CSS，但javascript也可以。我的第一个想法是放置一个div，其颜色与我想要的颜色和广告div的宽度和高度相同，并对其应用不透明度设置，使其混合在一起。想法？

Answer 1

如果是我们正在讨论的Google AdSense，我很确定您不会这样做，请阅读Google AdSense policies页面。

尽管如此，唯一合理的解决方案是使用混合，但这会产生糟糕的结果，并且您直接违反了Obscured by elements on a page策略规则。

Answer 2

首先，我不认为您的广告客户会对您改变广告的配色方案感到满意（考虑品牌颜色等），但它应该是可行的。

使用具有背景颜色和不透明度的叠加效果可能无法获得最令人满意的结果，但它是朝着您想要实现的目标迈出的一步。唯一的问题是叠加层会使链接无法点击，因此必须这样做，以便广告的图片位于底部，而叠加层实际上是链接。例如，这可能有效：

<div class="ad-container">
    <img src="ad_image.jpg" />
    <a href="www.ad.com">Real ad link</a>
</div>

在CSS中：

.ad-container {
    position: relative;
}

.ad-container a {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #f00;
    opacity: 0.5;
    filter: alpha(opacity=50); /* for IE */
    text-indent: -9999px; /* Hide text */
}

重新着色图片广告以匹配网站主题

2 个答案: