CSS 设置 Adsense 自适应广告单元的最大高度
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/26338357/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Set max height of Adsense responsive ad unit
提问by user3275551
I had 2 x (300x250) Adsense ad units in the right side bar of my site
我的网站右侧栏中有 2 x (300x250) Adsense 广告单元
I have made the site responsive and replaced these ad units with Adsense responsive ad units.
我使网站具有响应性，并用 Adsense 响应性广告单元替换了这些广告单元。
The problem i now have is that Adsense is now serving 2 x (300x600) ad units. Adsense TOS state that you can only serve 1 (300x600) ad unit per page
我现在遇到的问题是 Adsense 现在提供 2 x (300x600) 广告单元。Adsense TOS 规定每页只能投放 1 (300x600) 个广告单元
The max width is obviously getting picked up by adsense responsive ad units.
Adsense 响应式广告单元显然会占用最大宽度。
But when I try and set the max-height of the parent div to 250px, to limit the number of 300x600 ads per page, the max-height gets ignored and adsense still displays a 300x600
但是当我尝试将父 div 的 max-height 设置为 250px 以限制每页 300x600 广告的数量时，max-height 被忽略并且 adsense 仍然显示 300x600
Has anyone else encountered this problem and if so, how did you manage to set the max-height of the responsive ad unit?
有没有其他人遇到过这个问题，如果有，你是如何设置自适应广告单元的最大高度的？
Thanks in advance,
提前致谢，
Kes
凯斯
回答by galeksic
You could change data-ad-format="auto"to data-ad-format="rectangle". (See Advanced features > Horizontal shape example.)
你可以data-ad-format="auto"改为data-ad-format="rectangle". （请参阅高级功能 >水平形状示例。）
I think you should notdefine height(max-height) on parent div.
我想你应该不定义height（max-height）的母公司div。
Ad height is (automatically) determined by adsbygoogle.js(that is smartsizing) and if you want to control ad height you need to use data-ad-format("rectangle", "vertical", "horizontal" or your preferred combinationlike "rectangle,horizontal").
广告高度（自动）由adsbygoogle.js（即智能调整大小）确定，如果您想控制广告高度，您需要使用data-ad-format（“矩形”、“垂直”、“水平”或您喜欢的组合，如“矩形、水平”）。
Or (not recommended) you could "downgrade" the ad code (by removing data-ad-formatattribute) and then specify the exactsize(s)with @mediaqueries. (See Exact size example.)
或者（不推荐）您可以“降级”广告代码（通过删除data-ad-format属性），然后使用 @查询指定确切的尺寸media。（请参阅确切尺寸示例。）
EDIT- Google updated "Technical considerations" section on "About responsive ad units" page.
编辑- Google 更新了“关于自适应广告单元”页面上的“技术注意事项”部分。
There are some situations in which you'll need to take extra action to make a responsive ad unit work correctly:
...
The parent container has fixed or limited height. Responsive ads should not be placed inside containers with a fixed or limited height, as they may be taller on some devices or browsers. If you need to limit the height of your responsive ads, you'll need to modify your code and use CSS media queries to set the height of the parent container. Find out how to modify your responsive ad unit.
在某些情况下，您需要采取额外措施才能使自适应广告单元正常工作：
...
父容器具有固定或有限的高度。自适应广告不应放置在高度固定或有限的容器内，因为它们在某些设备或浏览器上可能更高。如果您需要限制自适应广告的高度，则需要修改代码并使用 CSS 媒体查询来设置父容器的高度。了解如何修改您的自适应广告单元。
回答by Wesiwyg
I've just managed to fix this - you can set a comma seperated list for data-ad-format.
我刚刚设法解决了这个问题 - 您可以为 data-ad-format 设置一个逗号分隔的列表。
data-ad-format="rectangle, horizontal"
数据广告格式=“矩形，水平”
This sets the mobile ad to horizontal and the desktop to rectangle if you have set your media queries specific sizes.
如果您已设置媒体查询特定尺寸，这会将移动广告设置为水平广告，并将桌面广告设置为矩形。
Thanks, Wesiwyg
谢谢，Wesiwyg
回答by Wesiwyg
To get this done, First set the ad container or ad code to center. by using this tag: <center>Adsense code here</center>. and then set the maximum height or width and minimum height or width like the way I did in the example below.
为此，首先将广告容器或广告代码设置为居中。通过使用这个标签：<center>Adsense code here</center>。然后像我在下面的示例中所做的那样设置最大高度或宽度以及最小高度或宽度。
<center>
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js">
</script>
<!--responsive ad -->
<ins class="adsbygoogle" style="display:block;max-width:specify your maximum width here; max-height: set o your maximum height here; and do the same for min-height:here;min-width:here;"
data-ad-client="ca-pub-0019"
data-ad-slot="530000000000"
data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</center>`
回答by Kviz Majster
I would go with this:
我会这样做：
style="display:inline-block;min-width:200px;max-width:300px;width:100%;height:250px"
data-ad-format="horizontal"></ins>
Google itself recommends it this way and it really works for me:
谷歌本身以这种方式推荐它，它真的对我有用：
回答by user2267379
Working for me at january 2020 :
2020 年 1 月为我工作：
1 - Disabled "auto size for mobile"
1 - 禁用“移动自动调整大小”
2 - Define an "non-responsive" ads (fixed) from default value
2 - 从默认值定义“无响应”广告（固定）
3 - add your code and change size of it why you want with css. Exemple for me :
3 - 添加您的代码并使用 css 更改其大小。以我为例：
<ins class="adsbygoogle" style="display:inline-block;width:100%;height:100px" data-ad-client="****" data-ad-slot="****"></ins>
<ins class="adsbygoogle" style="display:inline-block;width:100%;height:100px" data-ad-client="****" data-ad-slot="****"></ins>
With this code my ads take always 100% of width and max 100px of height. I think you can add "min-width" and "max-width" value.
使用此代码，我的广告始终采用 100% 的宽度和最大 100px 的高度。我认为您可以添加“最小宽度”和“最大宽度”值。
3 conditions can lead to resize your ad without your knowledge :
3 个条件可能会导致在您不知情的情况下调整广告大小：
1 - If the ad is a "responsive ad"
1 - 如果广告是“响应式广告”
2 - If the parameter "optimize size of ads on mobile" is activated
2 - 如果参数“优化移动广告尺寸”被激活
3 - If the global "automatic ads" is activated with "Optimize your existing ad units?" set to on.
3 - 如果通过“优化您现有的广告单元？”激活全局“自动广告”？设置为开。
回答by Mladen Adamovic
As of January 2020, max-height on ins which displays seems to work without bugs (if you do that on the parent container, there are bugs), so this seems to work (I'm using it in the production):
截至 2020 年 1 月，显示的 ins 上的 max-height 似乎没有错误（如果您在父容器上这样做，则存在错误），所以这似乎有效（我在生产中使用它）：
<ins class="adsbygoogle"
style="display:block; max-height: 336px"
data-ad-client="ca-pub-XXXXXX"
data-ad-slot="YYYYYY"
data-ad-format="auto"
data-full-width-responsive="true"></ins>
EDIT: this is officially possible as of August 2019, see https://support.google.com/adsense/answer/9467650?hl=en
编辑：截至 2019 年 8 月，这正式成为可能，请参阅https://support.google.com/adsense/answer/9467650?hl=en
