YouTube 動画は、<devsite-video> カスタム要素を使用してドキュメントに埋め込んで、ユーザーが iframe でコンテンツを確認できるようにします。このウィジェットは、使用統計情報を追跡して Google アナリティクスに送信します。
Default
これはデフォルトの埋め込み YouTube 動画の例です。div 要素内で <devsite-video> をラップし、class 属性を video-wrapper に設定しています。
大画面では、動画がコンテンツ領域の幅の 50% になり、動画が前面に表示されるコンテンツの右にフローティングされます。小さな画面では、動画はコンテンツ領域の幅の 100% になります。
左にフローティング
この動画は、class 属性を video-wrapper-left に設定すると、先行するコンテンツの左にフローティング表示されます。
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voltptate velit esse cillum dolore eu fugiat nulla pariatur. それ以外は、sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit Animal id est laborum.
全幅
この動画はコンテンツ エリアの幅の 100% であり、class 属性を video-wrapper-full-width に設定しても、動画の前のコンテンツのレイアウトに影響しません。
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voltptate velit esse cillum dolore eu fugiat nulla pariatur. それ以外は、sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit Animal id est laborum.