Amp html 放大器图像超出DIV限制

我试图在我的博客上使用AMP，将图像转换为AMP图像会导致图像脱离div并破坏整个显示

未激活AMP时，图像如下所示：

<img class="alignleft size-full wp-image-3654" src="https://www.laurentwillen.be/wp-content/uploads/sites/21/2018/10/honor-8x-test-avis-review-photo-taille-main.jpg" alt="honor 8x test avis review photo taille main" width="2500" height="1875" srcset="https://test.laurentwillen.be/wp-content/uploads/sites/25/2018/10/honor-8x-test-avis-review-photo-taille-main.jpg 2500w, https://test.laurentwillen.be/wp-content/uploads/sites/25/2018/10/honor-8x-test-avis-review-photo-taille-main-300x225.jpg 300w, https://test.laurentwillen.be/wp-content/uploads/sites/25/2018/10/honor-8x-test-avis-review-photo-taille-main-768x576.jpg 768w, https://test.laurentwillen.be/wp-content/uploads/sites/25/2018/10/honor-8x-test-avis-review-photo-taille-main-1024x768.jpg 1024w, https://test.laurentwillen.be/wp-content/uploads/sites/25/2018/10/honor-8x-test-avis-review-photo-taille-main-1400x1050.jpg 1400w, https://test.laurentwillen.be/wp-content/uploads/sites/25/2018/10/honor-8x-test-avis-review-photo-taille-main-900x675.jpg 900w, https://test.laurentwillen.be/wp-content/uploads/sites/25/2018/10/honor-8x-test-avis-review-photo-taille-main-700x525.jpg 700w, https://test.laurentwillen.be/wp-content/uploads/sites/25/2018/10/honor-8x-test-avis-review-photo-taille-main-500x375.jpg 500w" sizes="(max-width: 2500px) 100vw, 2500px" />

当放大器被激活时，它们看起来是这样的

<amp-img  class="alignleft size-full wp-image-3654" src="https://www.laurentwillen.be/wp-content/uploads/sites/21/2018/10/honor-8x-test-avis-review-photo-taille-main.jpg" alt="honor 8x test avis review photo taille main" width="2500" height="1875" srcset="https://test.laurentwillen.be/wp-content/uploads/sites/25/2018/10/honor-8x-test-avis-review-photo-taille-main.jpg 2500w, https://test.laurentwillen.be/wp-content/uploads/sites/25/2018/10/honor-8x-test-avis-review-photo-taille-main-300x225.jpg 300w, https://test.laurentwillen.be/wp-content/uploads/sites/25/2018/10/honor-8x-test-avis-review-photo-taille-main-768x576.jpg 768w, https://test.laurentwillen.be/wp-content/uploads/sites/25/2018/10/honor-8x-test-avis-review-photo-taille-main-1024x768.jpg 1024w, https://test.laurentwillen.be/wp-content/uploads/sites/25/2018/10/honor-8x-test-avis-review-photo-taille-main-1400x1050.jpg 1400w, https://test.laurentwillen.be/wp-content/uploads/sites/25/2018/10/honor-8x-test-avis-review-photo-taille-main-900x675.jpg 900w, https://test.laurentwillen.be/wp-content/uploads/sites/25/2018/10/honor-8x-test-avis-review-photo-taille-main-700x525.jpg 700w, https://test.laurentwillen.be/wp-content/uploads/sites/25/2018/10/honor-8x-test-avis-review-photo-taille-main-500x375.jpg 500w" sizes="(max-width: 2500px) 100vw, 2500px" / layout="responsive" /></amp-img>

我可以强制父DIV变小，但不会影响图片

你知道吗

谢谢

Laurent
您似乎已将“大小”属性设置为“100vw”，最大浏览器宽度为4000px

sizes="(max-width: 4000px) 100vw, 4000px"

更改父div的大小没有任何作用，因为内部实际上是绝对定位的，因此不受父div宽度的影响

我觉得这篇文章很有用，也许对你也有用：

嗨，罗西娜，是的，这正是重点。我尝试了不同的值，但问题是，在1000px以上，父div占据了75%的宽度，因此我自然会使用75vw，但它与可用空间不完全匹配，存在细微差异。我基本上希望将图像拉伸到可用宽度的100%。如果我用浏览器控制台删除尺寸，它会工作，但是如果我从代码中删除它，AMP根本不会显示图像。在您的页面中发现了很多错误（您可能需要检查AMP验证器）。我注意到在
大小
之后和
布局
之前有一个额外的“
/
”。尝试删除它并修复验证程序中的错误，以帮助AMP页面按预期工作。