2016-07-14 15 views
0

divを完全に埋めるために背景イメージを取得しようとしています。背景サイズ:カバーが背景画像の高さを設定していない

.class{ 
    background-image: url('img.jpg'); 
    background-repeat: no-repeat; 
    background-size: cover; 
} 

及び(.row財団6である)

<div class="row columns"> 
    <div class="class">&nbsp;</div> 
</div> 

を使用すると、画像が容器の幅を横切って延び、しかし高さは、23px、&nbsp;のおそらくラインの高さ程度です。画像の高さを画像の高さにするには、幅をcoverに設定するにはどうすればよいですか?

+0

背景色の作品ですか? –

+0

@MohitBhardwaj background-imageをbackground-colorに置き換えた場合、その色はイメージと同じスペースを塗りつぶします – 1252748

+1

それは、あなたの '.class'要素があなたが期待している高さを持たないからです。あなたが見る '.row'のパディングだけです。例:高さを追加してみてください。 'height:100px;'を '.class'に追加します。 –

答えて

0

私はdivのすべてを埋めて幅と高さを調整したいと思っています:私はこのコードをバックグラウンドに使用していますし、divでも直接作業しています:(https://css-tricks.com/perfect-full-page-background-image/

あなたが使用する背景のサイズを、指定したい場合は
.class { 

background: url(demo.jpeg) no-repeat center center fixed; 
-webkit-background-size: cover; 
-moz-background-size: cover; 
-o-background-size: cover; 
background-size: cover; 

} 

また、:

background-size: 80px 60px; 

あなたが使用することができます:

@media screen {} 

あなたは、背景やCSSクラスのどの部分を調整し、画面

重要のサイズのベース、チェックしたい場合:margin:0px; or padding:0px;

が、これはあなたを助けるなら、私を知ってみましょうか、何かが必要な場合より具体的。

関連する問題