Do you build things with AMP? Fill out the new AMP Developer Survey!
AMP

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.

Deskripsi Elemen container serbaguna generik yang menghadirkan tata letak AMP yang canggih ke semua elemen.
Tata Letak yang Didukung container, fill, fixed, fixed-height, flex-item, intrinsic, responsive

Ringkasan

Komponen amp-layout memungkinkan Anda menerapkan tata letak responsive berbasis rasio tinggi lebar ke semua elemen. Komponen amp-layout berfungsi dengan cara yang mirip untuk atribut layout pada komponen AMP yang ada, tetapi mendukung semua markup HTML sebagai turunan. Tata letak lain yang didukung semuanya dapat digunakan dengan amp-layout (misalnya, fixed-height, fixed, dll.).

Contoh

Contoh ini menggunakan amp-layout untuk membuat container responsif di sekitar lingkaran yang digambar dengan SVG inline.

<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>

Atribut

Elemen ini mencakup atribut umum yang diperluas ke komponen AMP.

Validasi

Lihat aturan amp-layout dalam spesifikasi validator AMP.

Perlu bantuan lainnya?

Anda telah membaca dokumen ini belasan kali, tetapi belum semua pertanyaan Anda terjawab? Mungkin orang lain merasakan hal yang sama. Berinteraksilah dengan mereka di Stack Overflow.

Kunjungi Stack Overflow
Menemukan bug atau ada fitur yang kurang?

Proyek AMP sangat menganjurkan partisipasi dan kontribusi Anda! Kami berharap Anda akan terus ambil bagian dalam komunitas sumber terbuka kami, tetapi kami juga menerima kontribusi satu kali untuk topik tertentu yang Anda minati.

Kunjungi GitHub