为div下所有img标签设置CSS样式是否会影响谷歌图片广告样式?
自定义容器图片样式是否会影响内部谷歌图片广告
明确结论
会,这套样式规则不仅会改动谷歌图片广告的原有样式,还有大概率触发谷歌广告的违规判定。
原因说明
- 你使用的
.articles-container img是CSS后代选择器,会无差别命中该容器下所有层级的<img>标签,不管是你自己上传的文章配图,还是后续谷歌广告代码自动渲染生成的广告图片元素,都会被这套规则匹配。 - 规则里写死的
width: 500px、height: 400px会强制拉伸、压缩广告素材,完全破坏广告原本的适配比例;border-radius: 20px会直接裁切广告的边角,改掉广告原生的视觉设计。 - hover状态下设置的4px灰色边框、灰色背景效果同样会作用在广告图片上,用户鼠标悬停到广告区域时,会出现不属于广告原生设计的样式变化。
正确修改方式
不要用匹配容器下所有img的宽泛选择器,给你自己的文章配图加专属类名,让样式只作用在自有内容的图片上即可,参考代码如下:
调整后的HTML结构:
<div class="articles-container"> <img class="article-cover" src=""> <img class="article-cover" src=""> <img class="article-cover" src=""> <!-- 谷歌广告放置位置 --> </div>
调整后的CSS规则:
.articles-container .article-cover { height: 400px; width: 500px; border-radius: 20px; } .articles-container .article-cover:hover { border: 4px grey solid; background: grey; }
注意:谷歌广告相关政策明确要求,发布商不得擅自修改广告默认展示样式、不得裁切遮挡广告内容,随意给广告元素追加自定义样式,轻则导致广告渲染失败、收益异常,重则可能触发账号违规处罚。
内容的提问来源于stack exchange,提问作者Soumya Roy
相关产品推荐
相关产品推荐

