私の '：アフター'バックグラウンドイメージを中央に配置するには？

Question

私は、ブラウザの全幅と高さをカバーする背景画像を持っています。小さな画面でhtmlファイルを開くと、画像の左側のみが表示されます。

私が望むのは、画像を背景にスケールして中央に置くことです。私のCSSコードで何を変更する必要がありますか？

div#background-content { 
    position: relative; 
} 

div#background-content:after { 
    background-image:url('./images/sunrise.jpg'); 
    opacity:0.7; 
    width: 100%; 
    height: 100%; 
    background-size:cover; 
    display:block; 
    content : ""; 
    position: absolute; 
    top: 0; 
    left: 0; 
    z-index: -1; 
} 

Answer 1

を使用するようにお奨め：

div#background-content:after { 
    background-size:contain; 
    background-position:center; 
    } 

Answer 2

CSS background-position：

background-position: center;

Answer 3

のbackground-positionを追加：センター; 私はあなたがあなたのCSSでこのコードを追加することができますbackground:url('./images/sunrise.jpg') no-repeat center;

Answer 4

div#background-content:after{ 
    background-position: 50% 50%; 
    background-size: cover; 
    background-repeat: no-repeat; 
} 

Answer 5

div#background-content:after { 
background-image:url('./images/sunrise.jpg'); 
opacity:0.7; 
width: 100%; 
height: 100%; 
background-position: left -206px top -95px !important; 
background-size: 320% 110% !important; 
display:block; 
content : ""; 
position: absolute; 
top: 0; 
left: 0; 
z-index: -1; 

}