修改CSS让谷歌AdSense广告内容居中显示

寻技术 Html/CSS 2023年10月13日 64

办法1 – 直接在AdSense代码中修改。

示例:

(adsbygoogle = window.adsbygoogle || []).push({});

修改为

(adsbygoogle = window.adsbygoogle || []).push({});

其中display:inline-block改为display:block、增加margin:auto,就可以让广告居中。

修改前广告居左,修改后广告居中

方法2 – 修改外围div的CSS。

示例:

amp广告本身不能带css,也只有修改外围,原amp广告代码外面添加一个div:

type="adsense"

data-ad-client="ca-pub-xxxxxxxxxxxx"

data-ad-slot="xxxxxxxxxx"

在此代码调用的外部增加一个DIV包围,同时用CSS文件中定义这个

.left_column {
    display: flex;
    justify-content: center;
}

广告就可以居中了,这个办法其实比第一个办法更通用,对amp广告或者普通web广告在现在流行的浏览器中都有效,只是在IE9等很老的浏览器无效。

关闭

用微信“扫一扫”