AMP旋转木马动态高度

Question

我在页面中有一个amp-carousel元素，但在渲染之前我不知道它的高度。如果我使用layout="responsive"高度显然是错误的，因为我没有宽高比正确的 - 我使用100px两者。

最新其他选项？我试过layout="flex-item"，但完全摧毁了旋转木马。

Answer 1

如本GitHub post提及迪马Voytenko，

layout=responsive实质上意味着 “响应宽度”。它会根据高宽比自动获取所有可用宽度并自动计算高度。

但请注意layout=responsive只支持slides类型的传送带。 （参考：amp-carousel）

有了这一点，你可以选择考虑使用这个例子：

<amp-carousel width="100" height="100" controls layout="responsive" type="slides"> 

你可能要检查这个link更多的例子。

最后，您可能还希望访问以获取更多信息如下：

• Layout & Media queries
• What if the layout attribute isn’t specified?
• Responsive amp-carousel

Answer 2

这不是强制性知道图像宽度和高度响应式布局的图像。你应该匹配的是图像的纵横比（我不知道你是否事先有这个数据）。请参阅“设置宽高比”https://www.ampproject.org/es/docs/reference/components/amp-img

如果您没有宽高比，则应使用服务器端代码来确定此比率或图像的大小。

Dinamically或自动AMP不会为您设置图像宽度或高度，因为这种HTML避免了重新绘制和其他昂贵的东西来快速加载页面。

希望有所帮助。