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
| Descripción | Elemento contenedor genérico y multipropósito que aporta diseños de AMP de gran utilidad |
| Diseños admitidos | container, fill, fixed, fixed-height, flex-item, intrinsic y responsive |
Descripción general
El componente amp-layout permite aplicar a cualquier elemento diseños adaptables basados en la relación de aspecto. Funciona de forma similar al atributo layout en los componentes AMP disponibles, pero admite cualquier etiqueta HTML como elemento secundario. Todos los demás diseños admitidos funcionan con amp-layout (por ejemplo, fixed-height, fixed, etc.).
Ejemplo
En este ejemplo se utiliza amp-layout para crear un contenedor adaptable alrededor de un círculo dibujado mediante SVG insertado.
<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" />
Lo sentimos, pero tu navegador no es compatible con SVG insertado.
</svg>
</amp-layout>
Atributos
Este elemento incluye atributos comunes que se aplican a los componentes de AMP.
Validación
Consulta las reglas de amp-layout en la especificación de la herramienta de validación de AMP.
¿Ha leído este documento una docena de veces pero realmente no responde todas sus preguntas? Quizás otras personas piensen lo mismo: póngase en contacto con ellas en Stack Overflow.
Ir a Stack Overflow ¿Encontró un error o considera que falta una función?¡El proyecto AMP alienta profundamente su participación y contribuciones! Esperamos que se convierta en un miembro permanente de nuestra comunidad de código abierto, pero también agradecemos las contribuciones esporádicas sobre los temas que le apasionan especialmente.
Ir a GitHub