Geek Answers Handbook

How to set background image size suitable for div

I want to set the background image of a div div (w: 932, h: 148), and the image size is 1524 * 587
what I'm trying to set its image is not suitable for the size of the div, what should I do? my code is

.header .logo { width:932px; height:148px; background:url(images/logo.jpg) no-repeat center;}
+6
html css image
source share
2 answers

You can use the CSS3 background-size property for this.

 .header .logo { background-size: 100%; }

But you still have a problem with browser support (or not). It is best to use the "plain vanilla" <img> element, whose width / height is set to 100% .

+11
source share

You cannot resize the background image in the current supported CSS version (2.1).

You can overlay elements on top of each other to get an image element behind your content, but you need to resize the actual image rather than display it. This will roughly reduce the file size to a fifth.

0
source share

More articles:


All Articles