常用元素屬性
AMP 提供了一組常用屬性，這些屬性擴展到許多 AMP 元件 (和 HTML 元素)。本文檔描述了每個常用屬性。
fallback (回退)
當瀏覽器不支援元素或載入底層資源失敗時，會顯示回退 (fallback)。fallback 屬性可以放置在任何 HTML 元素上，該元素是支援回退的 AMP 元素的直接子元素。關於回退的確切行為取決於元素的實作方式，但通常回退元素會顯示以取代常規元素。
常用於：圖片、動畫、音訊和影片
範例
<amp-img src="invalid.jpg" height="400" width="300" layout="responsive" alt="...">
<div fallback style="background-color: #ccc; display: flex; justify-content: center; align-items: center;">
Could not load image
</div>
</amp-img>
如需更多資訊，請參閱預留位置與回退。
heights (高度)
所有支援 responsive 版面配置的 AMP 元素也支援 heights 屬性。此屬性的值是基於媒體表達式的尺寸表達式，類似於 img 標籤上的 sizes 屬性，但有兩個主要差異
- 該值適用於元素的高度，而非寬度。
- 允許百分比值。百分比值表示元素寬度的百分比。例如，
80%的值表示元素的高度將為元素寬度的 80%。
heights 屬性與 width 和 height 一起指定時，layout 會預設為 responsive。範例
<amp-img src="amp.png"
width="320" height="256"
alt="..."
heights="(min-width:500px) 200px, 80%">
</amp-img>
如需更多資訊，請參閱使用 srcset、sizes 和 heights 的美術指導。
layout (版面配置)
AMP 提供了一組版面配置，用於指定 AMP 元件在文件版面配置中的行為方式。您可以透過新增 layout 屬性以及元素支援的版面配置值之一 (請參閱元素的文件以了解支援的值) 來為元件指定版面配置。
範例
<amp-img src="/img/amp.jpg"
width="1080"
height="610"
layout="responsive"
alt="...">
</amp-img>
media (媒體)
大多數 AMP 元素都支援 media 屬性。media 的值是媒體查詢。如果查詢不符，則不會呈現元素，並且不會提取其資源以及可能包含的子資源。如果瀏覽器視窗調整大小或方向，則會重新評估媒體查詢，並根據新的結果隱藏和顯示元素。
範例
<amp-img
media="(min-width: 650px)"
src="wide.jpg"
width="466"
height="355"
layout="responsive"
alt="..."></amp-img>
<amp-img
media="(max-width: 649px)"
src="narrow.jpg"
width="527"
height="193"
layout="responsive"
alt="..."></amp-img>
如需更多資訊，請參閱版面配置與媒體查詢。
noloading (無載入指示)
noloading 屬性指示是否應關閉此元素的「載入指示器」。許多 AMP 元素都會顯示「載入指示器」，這是一個基本動畫，用於顯示元素尚未完全載入。
常用於：圖片、動畫、影片和廣告
範例
<amp-img src="card.jpg"
noloading
height="190"
width="297"
layout="responsive"
alt="...">
</amp-img>
on (事件處理器)
on 屬性用於在元素上安裝事件處理器。支援的事件取決於元素。
常用於：燈箱、側邊欄、即時列表和表單
語法
eventName:targetId[.methodName[(arg1=value, arg2=value)]]
範例
<button on="tap:my-lightbox">Open lightbox</button>
<amp-lightbox id="my-lightbox" layout="nodisplay">
...
</amp-lightbox>
如需更多資訊，請參閱AMP 中的動作和事件。
placeholder (預留位置)
placeholder 屬性指示標記有此屬性的元素充當父 AMP 元素的預留位置。該屬性可以放置在任何 HTML 元素上，該元素是支援預留位置的 AMP 元素的直接子元素。預設情況下，即使 AMP 元素的資源尚未下載或初始化，也會立即顯示 AMP 元素的預留位置。準備就緒後，AMP 元素通常會隱藏其預留位置並顯示內容。關於預留位置的確切行為取決於元素的實作方式。
常用於：圖片、動畫、影片和廣告
範例
<amp-anim src="animated.gif" width="466" height="355" layout="responsive" alt="...">
<amp-img placeholder src="preview.png" layout="fill" alt="..."></amp-img>
</amp-anim>
如需更多資訊，請參閱預留位置與回退。
sizes (尺寸)
所有支援 responsive 版面配置的 AMP 元素也支援 sizes 屬性。AMP sizes 屬性的值是一個尺寸表達式，用於根據目前的視窗大小選擇與媒體查詢相對應的已定義尺寸。此外，AMP 會為元素設定 width 的內嵌樣式。
範例
<amp-img src="amp.png"
width="400" height="300"
layout="responsive"
alt="..."
sizes="(min-width: 320px) 320px, 100vw">
</amp-img>
將產生以下巢狀 img 標籤
<img decoding="async"
src="amp.png"
alt="..."
sizes="(min-width: 320px) 320px, 100vw"
class="i-amphtml-fill-content i-amphtml-replaced-content">
如需更多資訊，請參閱使用 srcset、sizes 和 heights 的美術指導。
width and height (寬度和高度)
對於某些版面配置，AMP 元件必須具有包含整數像素值的 width 和 height 屬性。
範例
<amp-anim width="245"
height="300"
src="/img/cat.gif"
alt="...">
</amp-anim>