The AMP Component Catalogue
The AMP HTML library consists of a basic runtime that brings the core functionalities of AMP to your page. If you want to add additional features you can do so by using one or more of the ready-to-use AMP components. They are classified as:
 Extended Extensions to the base library that must be explicitly included in the document as custom elements. 
  Experimental Components that are released but are not yet ready for wide use. 
 Highlighted Components
Filter by category
广告分析
 amp-ad-exit 
 Provides configurable behavior for ad exits for AMPHTML ads.
  amp-ad 
 一种用于展示广告的容器。
  amp-analytics 
 从 AMP 文档获取分析数据。
  amp-auto-ads 
 通过使用远程提供的配置文件,向 AMP 网页中动态投放广告。
  amp-call-tracking 
 Dynamically replaces a phone number in a hyperlink to enable call tracking.
  amp-experiment 
 Used to conduct user experience experiments on AMP pages.
  amp-pixel 
 一种跟踪像素,用于统计网页浏览量。
  amp-social-share 
 分享跟踪功能正在开发中。
  amp-sticky-ad 
 Provides a way to display and stick ad content at the bottom of the page.
  amp-story-auto-analytics 
 Automatically generates analytics configs for stories.
 动态内容
 amp-access-laterpay 
 可让发布商轻松集成 LaterPay 微支付平台。
  amp-access-poool 
 显示Poool付费专区。
  amp-access-scroll 
 与Scroll成员身份集成。
  amp-access 
 提供 AMP 付费墙和订阅支持。
  amp-action-macro 
 Creates reusable actions.
  amp-autocomplete 
 Suggests completed results corresponding to the user input as they...
  amp-bind 
 利用数据绑定和类似于 JS 的简单表达式,使元素因应用户操作或数据变更而变化。
  amp-byside-content 
 Displays dynamic content from the BySide service.
  amp-consent 
 Provides the ability to collect and store a user's consent through...
  amp-date-picker 
 提供用于选择日期的小部件。日期选择器可以呈现为覆盖,相对于输入字段,或作为静态日历小部件。
  amp-form 
 Allows you to create forms to submit input fields in an AMP document.
  amp-geo 
 Provides an approximate country-level geolocation interface.
  amp-gist 
 Creates an iframe and displays a GitHub Gist.
  amp-google-document-embed 
 Displays a document file supported by Google Drive.
  amp-inputmask 
 Provides input masking capabilities to inputs in AMP forms
  amp-install-serviceworker 
 Installs a ServiceWorker for the current page.
  amp-link-rewriter 
 Allows publishers to rewrite URL based on configurable pattern
  amp-list 
 动态下载数据并使用模板创建列表项。
  amp-live-list 
 Provides a way to display and update content live.
  amp-minute-media-player 
 Displays a Minute Media player.
  amp-mraid 
 Supports interaction with the MRAID host API within Ad webviews in...
  amp-mustache 
 允许呈现 Mustache.js 模板。
  amp-next-page 
 Infinite scrolling experience for document-level page recommendations.
  amp-recaptcha-input 
 Appends a reCAPTCHA v3 token to AMP form submissions.
  amp-render 
 Renders remote or inline data using a template.
  amp-script 
 在Web Worker中运行自定义JavaScript。
  amp-selector 
 表示一种控件,可显示选项菜单并让用户从中选择。
  amp-smartlinks 
 Run Narrativ's Linkmate process inside your AMP page
  amp-story-interactive 
 A rich set of interactive experiences for stories, including...
  amp-subscriptions-google 
 Implements subscription-style access protocol for Subscribe with Google.
  amp-subscriptions 
 Implements subscription-style access protocol.
  amp-user-notification 
 Displays a dismissable notification to the user.
  amp-video-docking 
 Functionality for videos that minimize ("dock") to a corner or a...
  amp-web-push 
 Allows users to subscribe to web push notifications.
 布局
 amp-accordion 
 提供一种方式,让观看者可以大致了解网页内容并随意跳至想查看的部分。
  amp-app-banner 
 A wrapper and minimal UI for a cross-platform, fixed-position...
  amp-base-carousel 
 Displays multiple similar pieces of content along a horizontal...
  amp-carousel 
 沿着一条横轴显示多个相似的内容片段。
  amp-fx-collection 
 Provides a collection of preset visual effects, such as parallax.
  amp-fx-flying-carpet 
 Wraps its children in a unique full-screen scrolling container...
  amp-iframe 
 显示 iframe。
  amp-image-lightbox 
 Provides a lightbox effect for a specified image.
  amp-image-slider 
 A slider to compare two images.
  amp-inline-gallery 
 Displays multiple similar pieces of content along a horizontal...
  amp-layout 
 The amp-layout` component allows you to apply aspect-ratio based...
  amp-lightbox-gallery 
 Provides a "lightbox” experience. Upon user interaction, a UI...
  amp-lightbox 
 以完整视口“灯箱”模式显示元素。
  amp-mega-menu 
 显示可扩展容器中的顶级导航内容。
  amp-nested-menu 
 Displays a drilldown menu with arbitrary levels of nested submenus.
  amp-orientation-observer 
 Monitors the orientation of an element within the viewport as a...
  amp-position-observer 
 Monitors the position of an element within the viewport as a user...
  amp-sidebar 
 用于显示旨在供临时访问的元内容,例如导航链接、按钮、菜单。
  amp-stream-gallery 
 Displays multiple similar pieces of content at a time along a...
 媒体
 amp-3d-gltf 
 显示 GL 传输格式 (glTF) 的 3D 模型。
  amp-3q-player 
 嵌入来自3Q SDN的视频。
  amp-anim 
 管理动画图像,通常是GIF。
  amp-apester-media 
 Displays an Apester smart unit.
  amp-audio 
 替代 HTML5 audio 标记。
  amp-bodymovin-animation 
 Displays an AirBnB Bodymovin animation player.
  amp-brid-player 
 Displays a Brid.tv player.
  amp-brightcove 
 Displays a Brightcove Video Cloud or Perform player.
  amp-connatix-player 
 Displays a cloud-hosted Connatix Player.
  amp-dailymotion 
 Displays a Dailymotion video.
  amp-delight-player 
 The amp-delight-player element displays a cloud-hosted Delight Player.
  amp-embedly-card 
 Displays an Embedly card.
  amp-google-read-aloud-player 
 Embeds the Google Read Aloud Player.
  amp-hulu 
 Displays an embedded Hulu video.
  amp-ima-video 
 Embeds a video player for instream video ads that are integrated...
  amp-img 
 替换 HTML5 img 标记。
  amp-imgur 
 Displays an Imgur post.
  amp-izlesene 
 Displays an Izlesene video.
  amp-jwplayer 
 Displays a cloud-hosted JW Player.
  amp-kaltura-player 
 Displays the Kaltura Player as used in Kaltura's Video Platform.
  amp-megaphone 
 Displays a Megaphone.fm podcast episode or playlist.
  amp-mowplayer 
 Displays a cloud-hosted Mow Player.
  amp-nexxtv-player 
 Displays a media stream from the nexxOMNIA platform.
  amp-o2-player 
 Displays an AOL O2Player.
  amp-ooyala-player 
 Displays an Ooyala video.
  amp-playbuzz 
 Displays any Playbuzz item content (e.g., list, poll, etc.).
  amp-powr-player 
 An amp-powr-player component displays the Powr Player as...
  amp-reach-player 
 Displays a Beachfront Reach video player.
  amp-skimlinks 
 Run skimlinks inside your AMP page.
  amp-soundcloud 
 Displays a Soundcloud clip.
  amp-springboard-player 
 Displays a Springboard Platform video player.
  amp-story-360 
 Embeds 360 images and videos, explorable by gyroscope or...
  amp-story-panning-media 
 Transition an image's position and zoom between pages.
  amp-video-iframe 
 Embeds an iframe containing a video player.
  amp-video 
 替代 HTML5 视频标记。
  amp-vimeo 
 Displays a Vimeo video.
  amp-viqeo-player 
 Displays a Viqeo video player.
  amp-wistia-player 
 Displays a Wistia video.
  amp-yotpo 
 Embeds a Yotpo on-site widget.
  amp-youtube 
 显示 YouTube 视频。
 演示
 amp-access-fewcents 
 Allows publishers to integrate with the Fewcents micropayments platform.
  amp-animation 
 定义和显示动画。
  amp-date-countdown 
 Displays a countdown sequence to a specified date.
  amp-date-display 
 The amp-date-display component displays time data that you can...
  amp-dynamic-css-classes 
 Adds several dynamic CSS class names onto the <body> element.
  amp-fit-text 
 扩大或缩小字体大小以适合给定空间内的内容。
  amp-font 
 Trigger and monitor the loading of custom fonts on AMP pages.
  amp-mathml 
 Displays a MathML formula.
  amp-pan-zoom 
 Provides zooming and panning for arbitrary content.
  amp-slikeplayer 
 Displays a cloud-hosted Slike Player.
  amp-story-animation 
 A component for configuring custom animations in amp-story.
  amp-story-audio-sticker 
 A sticker for users to click and unmute the story.
  amp-story-auto-ads 
 Dynamically inserts ads into a Story.
  amp-story-captions 
 Custom video captions rendering.
  amp-story-cta-layer 
 A single layer of a single page of an AMP story, which allows...
  amp-story-grid-layer 
 A single layer of a single page of an AMP story that positions its...
  amp-story-page-outlink 
 A CTA button for opening external links with one tap in AMP story pages.
  amp-story-page 
 A single screen of an AMP story.
  amp-story-player 
 A player for embedding and playing your favorite stories in your...
  amp-story-shopping 
 A configurable, templated shopping experience in AMP story pages.
  amp-story-subscriptions 
 A configurable, templated subscriptions experience in AMP story pages.
  amp-story 
 A rich, visual storytelling format.
  amp-timeago 
 Provides fuzzy timestamps by formatting dates as time ago (for...
  amp-truncate-text 
 用省略号截断文本,可以选择显示一个溢出元素。
  amp-wordpress-embed 
 Embeds a WordPress post.
 
社交