如何设置AMP图像居中对齐

Question

如何在 amp 页面中进行如下设置？

<p align="center"><img src="img/LOCK1.png" width="40"> <img src="img/lock2.png"  width="40"> <img src="img/LOCK3.png" width="40"></p>

谢谢你！

Answer 1

对于 amp，您需要使用 amp-img 标签

AMP HTML 文件不支持普通的 HTML img 标记。AMP 借助 amp-img 提供了强大的替代品。

<p>
    <amp-img src="img/LOCK1.png"  layout="fixed" width="40" height="40" alt="Lock1"></amp-img>
    <amp-img src="img/lock2.png"  layout="fixed"  width="40" height="40" alt="Lock2"></amp-img>
    <amp-img src="img/LOCK3.png"  layout="fixed" width="40" height="40" alt="Lock3"></amp-img>
</p>

请参考：amp-img

您不能在 amp 中使用内联和外部 css

您可以使用以下语法的内部CSS

<style amp-custom>
  p {
    text-align: center;
  }
</style>