11

サイト内で動画を中央に配置しようとしていますが、HTML でセンター タグを使用したくありません。CSSでこれを行うにはどうすればよいですか？それが助けになるなら、これが私のHTMLコードです。

<center>
  <video width="320" height="240" controls>
    <source src="video.mp4" type="video/mp4">
    <source src="video.ogg" type="video/ogg">
    <source src="video.webm" type="video/webm">
    Your browser does not support the video tag.
  </video>
</center>
4

5 に答える 5

22

例を次に示します: http://jsfiddle.net/Cn7SU/

これらの CSS ルールを要素に追加するだけvideoです:

display: block;
margin: 0 auto;

display: blockプロパティを追加することは非常に重要です。そうしないと、要素を中央に配置できません。

于 2013-07-07T02:33:34.900 に答える
1

これを試して、ビデオタグの周りにラッパー div を配置してください。HTML5 の動画と画像は、スタイリング時にテキストのように扱われます。したがって、 text-align:center が機能します。以下のフィドルを確認できます。

<div class="video">  
  <video width="320" height="240" controls>
    <source src="video.mp4" type="video/mp4">
    <source src="video.ogg" type="video/ogg">
    <source src="video.webm" type="video/webm">
    Your browser does not support the video tag.
  </video>
</div>
于 2013-07-07T02:34:43.717 に答える