HTMLコード
<div class="aspect-w-16 aspect-h-9 bg-gray-900 dark:bg-gray-800 rounded-lg overflow-hidden">
<video controls class="w-full h-full object-cover">
<source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4">
Your browser does not support the video tag.
</video>
</div>関連コンポーネント
ビデオプレーヤーコンポーネント
紙や印刷物にインスパイアされた美学と補色スキームでデザインされたレスポンシブビデオプレーヤーコンポーネントで、フォーラムやコミュニティプラットフォームに適しています。ダークモードのサポートとセマンティックHTMLが含まれています。
Material_Design_Video_Player_Component
マテリアルデザインの美学、温かみのあるニュートラルな配色、ダークモードのサポートを備えたレスポンシブビデオプレーヤーコンポーネントで、予約/予約システムに適しています。ビデオのサムネイル、再生ボタン、タイトル、説明、および「今すぐ予約」の行動喚起を備えています。
ビデオプレーヤーコンポーネント
glassmorphismでデザインされたビデオプレーヤーコンポーネントで、補色を持つすりガラスのような効果が特徴です。インタラクティブでレスポンシブで、ダークテーマをサポートするブログコンテンツの消費に適しています。