AMP 版面配置展示

本頁面展示不同的 AMP 版面配置，以及螢幕尺寸調整時的運作方式。

填滿

使用 fill 版面配置時，元素會佔用可用的空間 (包含寬度和高度)。換句話說，「填滿」元素的版面配置和尺寸會與其父項相符。

使用 fixed 版面配置時，元素會根據元素的寬度和高度屬性保留其固定尺寸 (不具備回應式特性)。

使用 fixed-height 版面配置時，元素會佔用可用的空間，但高度保持不變。這種版面配置非常適合需要水平定位內容的元素 (例如 amp-carousel)。

使用 flex-item 版面配置時，元素及其父項中的其他元素會根據彈性盒模型佔用可用的空間。

使用 responsive 版面配置時，元素會佔用可用的空間，並根據元素寬度和高度屬性指定的長寬比自動調整高度。

使用 intrinsic 版面配置時，元素會佔用可用的空間，並根據寬度和高度屬性提供的長寬比自動調整高度，直到元素達到自然尺寸或達到 CSS 限制為止。

使用 container 版面配置時，元素可讓其子項定義其尺寸，非常像一般的 HTML div 標記。系統會假設元素本身沒有特定的版面配置，而僅作為容器。

使用 nodisplay 版面配置時，元素不會顯示。元素不會佔用螢幕上的任何空間，就像其顯示樣式為 none 一樣。