amp-layout
Description
The amp-layout` component allows you to apply aspect-ratio based responsive layouts to any element. The `amp-layout` component works similarly to the layout.
Supported Layouts
| Descrição | Um elemento de contêiner genérico e multifuncional que permite adicionar os layouts avançados de AMP a qualquer elemento. |
| Layouts compatíveis | container, fill, fixed, fixed-height, flex-item, intrinsic, responsive |
Visão geral
O componente amp-layout permite aplicar a qualquer elemento layouts responsivos com base na proporção. O componente amp-layout funciona de maneira semelhante ao atributo layout em componentes AMP existentes, mas aceita qualquer marcação HTML como filha. Todos os outros layouts compatíveis funcionam com amp-layout (por exemplo, fixed-height, fixed etc.).
Exemplo
Este exemplo usa o amp-layout para criar um contêiner responsivo em torno de um círculo desenhado com SVG in-line.
<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>
Atributos
Este elemento inclui atributos comuns estendidos a componentes de AMP.
Validação
Consulte as regras de amp-layout (link em inglês) nas especificações do validador de AMP.
Você já leu este documento várias vezes, mas ainda ficou com dúvidas sem respostas? Talvez outras pessoas pensem da mesma forma. Procure entrar em contato com elas no Stack Overflow.
Ir para o Stack Overflow Encontrou um bug ou sente falta de um recurso?O projeto AMP incentiva fortemente sua participação e contribuições! Esperamos que você se torne um participante assíduo de nossa comunidade de código aberto, mas também agradecemos contribuições pontuais para problemas que você tenha particular interesse.
Ir para o GitHub