<option id='xcmnfz'></option>
    1. <kbd id='xcmnfz'><kbd id='xcmnfz'></kbd><legend id='xcmnfz'></legend></kbd><code id='xcmnfz'></code><i id='xcmnfz'><fieldset id='xcmnfz'><strike id='xcmnfz'></strike></fieldset></i>

              <th id='xcmnfz'></th><tr id='xcmnfz'></tr>
              <address id='xcmnfz'></address>

                      • <abbr id='xcmnfz'></abbr>
                      灵宝网>新事>正文

                      实现Google AdSense广告自适应设计

                      2019-04-25 10:44:24 月光博客 分享

                        早先我们在《自适应网页设计的方法》一文中说明了网站自适应的修改方法,今天我们将着重讨论Google AdSense广告的自适应设计方法。

                        所谓自适应网页设计,就是让同一个网页代码,能够在不同设备上(从桌面电脑显示器到智能手机或其他移动产品设备)都能有更好的浏览体验,基本上对于双栏网站来说修改最简便,只要在HTML头部增加viewport标签,在CSS文件尾部增加针对不同屏幕分辨率的规则,布局宽度使用相对宽度,隐藏侧栏,半小时就能提升网站的手机移动浏览体验。

                        但是网站修改完成后,我们会发现原先的Google AdSense广告单元并没有实现自适应,浏览体验并不好,实际上,只要简单的几步操作,就能让Google AdSense广告实现自适应设计。

                        最简单的方法是新建一个广告单元,在“广告尺寸”里选择“自适应广告单元”即可,如下图所示,这个我们就不多讨论。

                        现在主要讨论一下原有的旧广告单元如何实现自适应设计。

                        首先,如果原有的Google AdSense广告代码类型为“同步”,则必须先将代码修改为“异步”代码,登录Google AdSense后台,在相应的广告单元里,点击“获取代码”,目前默认的代码就是异步代码。

                        之后,我们需要对代码进行一些修改,修改的方法有两种:

                        原有的示例代码:

                      <ins class="adsbygoogle"
                           style="display:inline-block;width:300px;height:250px"
                           data-ad-client="ca-pub-00000"
                           data-ad-slot="00000"></ins>

                        方法1、智能调整尺寸

                        将中间一行ins代码里的style="display:inline-block;width:300px;height:250px"替换为style="display:block",并在后面增加data-ad-format="auto"这个属性。

                        修改后的代码变为:

                      <ins class="adsbygoogle"
                           style="display:block"
                           data-ad-client="ca-pub-00000"
                           data-ad-slot="00000"
                           data-ad-format="auto"></ins>



                      声明:本站部分资源来源于网络,版权归原作者或者来源机构所有,如作者或来源机构不同意本站转载采用,请通知我们,我们将第一时间删除内容。本站刊载文章出于传递更多信息之目的,所刊文章观点仅代表作者本人观点,并不意味着本站赞同作者观点或证实其描述,其原创性及对文章内容的真实性、完整性、及时性本站亦不作任何保证或承诺,请读者仅作参考。
                      编辑:小青