amp-layout

用法

amp-layout 组件允许您将基于纵横比的响应式布局应用于任何元素。amp-layout 组件的工作方式类似于现有 AMP 组件上的 layout 属性，但支持任何 HTML 标记作为子元素。其他支持的布局都适用于 amp-layout（例如，固定高度、固定等）。

以下示例使用 amp-layout 来创建响应式容器，该容器围绕用内联 SVG 绘制的圆形。

<amp-layout layout="responsive" width="1" height="1">
  <svg viewBox="0 0 100 100">
    <circle cx="50%" cy="50%" r="40%" stroke="black" stroke-width="3" />
    Sorry, your browser does not support inline SVG.
  </svg>
</amp-layout>

属性

通用属性

amp-layout 组件包括 通用属性，已扩展到 AMP 组件。

验证

请参阅 AMP 验证器规范中的 amp-layout 规则。