は、画像をセンタリングし、画像

Question

内のビデオを置く私はテレビのこの画像を中央にしようとしていますが、それは右手を切断し、ページの左側にそれを置く保ちます。

私はまた、あなたがテレビでそれを見ているかのようにテレビの内側に黒のビデオ画面を配置しようとしています。

アイデア？

<div id="tv_container"> 
    <video> 
     <source src="video/video.mp4" type="video/mp4" /> 
    </video> 
</div> 

#tv_container { 
    background: url('70 TV.png'); 
    background-attachment: fixed; 
    background-position: center; 
    width: 1080px; /* Adjust TV image width */ 
    height: 608px; /* Adjust TV image height */ 

Answer 1

このようにそれを行うようにしてください：

#tv_container { 
    background-image: url('70 TV.png'); 
    background-attachment: fixed; 
    background-position: center; 
    background-repeat: no-repeat; // this will fix cutting issue if I understood you well 
    width: 1080px; 
    height: 608px; 
} 
// center video horizontally and vertically 
video { 
    position: absolute; 
    margin: auto; 
    left: 0; 
    right: 0; 
    top: 0; 
    bottom: 0; 
} 

やファイル名にスペースを使用しないように、例えば、あなたのイメージ70_TV.pngに名前を付けます。

Answer 2

使用background-size:containはあなたがbackgroundはそうすぐに私に戻って取得するためのあなたのdiv