htmlとCSSの背景URL画像は圧縮された

私はWebページの画像を作成し、画面を100％いっぱいにします。
しかし、問題が発生しました。以下に示すように
私は、Webページ上の画像をいっぱいにしたい：
htmlとCSSの背景URL画像は圧縮された

<!DOCTYPE html> 
<html> 
<head> 
<style type="text/css"> 
#section 
{ 
    margin-top:240px; 
    margin-left:140px; 
    padding:10px; 
    text-align:center; 
} 
#top-slogan 
{ 
    width:100%; 
    height:953px; 
    background: url('background.png') center; 
} 
#top-header 
{ 
    z-index:100; 
    position:absolute; 
    width:100%; 
    height:133px; 
} 
</style> 
</head> 
<body> 
<div id="top-slogan" class="wrapper"> 
    <div id="top-header" class="section"> 
    </div> 
</div> 
</body> 
</html>

結果が出てきた、いくつかの問題があります。
きつく塗りつぶさずに、イメージが繰り返されます。
解決策が必要です。

私は "この部分" を削除します：

出典

2016-09-22 F. Kim

You can add this style

#top-slogan{ 
background-repeat: no-repeat; 
background-size : cover; 
background position : center center; 
}

出典

2016-09-22 06:10:52

ありがとうございます！完璧！ –

あなたは大歓迎です:) –

あなたは何のリピートを追加することはできません。それからそれは繰り返されません。 "background-repeat：no-repeat;"

<!DOCTYPE html> 
<html> 
<head> 
<style type="text/css"> 
#section 
{ 
    margin-top:240px; 
    margin-left:140px; 
    padding:10px; 
    text-align:center; 
} 
#top-slogan 
{ 
    width:100%; 
    height:953px; 
    background: url('backgroung.png') center; 
    repeat:no-repeat; 
} 
#top-header 
{ 
    z-index:100; 
    position:absolute; 
    width:100%; 
    height:133px; 
} 
</style> 
</head> 
<body> 
<div id="top-slogan" class="wrapper"> 
    <div id="top-header" class="section"> 
    </div> 
</div> 
</body> 
</html>

出典

2016-09-22 06:04:18

はあなたに感謝してください。画面を塗りつぶしません.TT.TT –

この画像は、幅と高さを設定することによって拡大/縮小できます。＃トップスローガン { 幅：100％; 身長：953px; 背景：url（ 'backgroung.png'）center; \t背景サイズ：100％100％; \t repeat：no-repeat; } –

あなたはそれが幅と高さだ設定することで、この画像を拡大縮小することができます。

#top-slogan 

{ 
    width:100%; 
    height:953px; 
    background: url('backgroung.png') center; 
background-size: 100% 100%; 
repeat:no-repeat; 
}

出典

2016-09-22 06:22:55

おかげで男！良い一日を過ごしてください！ –

このワン

#top-slogan 
{ 
width:100%; 
height:953px; 
background: url('background.png') no-repeat center; 
background-size :cover; 
}

出典

2016-09-22 06:47:45

htmlとCSSの背景URL画像は圧縮された

答えて

関連する問題