0

我有一个要使用 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 的内联样式不起作用。有人能说出原因并解决这个问题吗?

4

1 回答 1

0

是的,AMP 中允许使用内联样式。对于上面我测试的示例,您为包装的 div 元素应用的样式正在工作。对于您在 amp-img 元素上作为“object-fit:cover”应用的样式,在您使用 layout="fill" 时将不起作用。在填充布局中,img 将采用其包裹元素的大小。

要使用 amp-img,最好使用固定比例的图像(例如 16x9),然后您可以使用布局响应,例如 layout="responsive" width="16" height="9"。

于 2020-07-06T12:22:38.957 回答