是否可以在 amp-img 中使用内联样式?



我有一个图像要使用amp html渲染,我想使用内联样式。我尝试了以下方法:

<div style=" position: relative;width:240px; height:120px;">
<amp-img layout="fill"style="object-fit: cover;" alt="" src="https://hips.hearstapps.com/ghk.h-cdn.co/assets/17/30/2560x1280/landscape-1500925839-golden-retriever-puppy.jpg?resize=480:*"> </amp-img>
</div>

但是 AMP-IMG 的内联样式不起作用。有人可以说出原因并给出这个问题的解决方案吗?

是的,AMP 中允许使用内联样式。对于我测试的上面的例子,您为包装的div 元素应用的样式正在工作。对于您在 amp-img 元素上应用的样式,作为"对象适合:封面"在这里不起作用,因为您使用 layout="fill"。在填充布局中,img 将采用其包装元素的大小。

要使用 amp-img,最好使用固定比例的图像(例如 16x9(,然后您可以使用布局响应式作为布局="响应式" 宽度="16" 高度="9"。

最新更新