CSS Can I resize the background image by changing the width and height?

Question

Given the following CSS rule,

#block1 {
 text-indent: -1000em;
 background: transparent url(../images/xxx.png) no-repeat scroll center center;
 width: 100px;
 height: 50px;
 display: inline-block;
}

Suppose an image xxx.png has a dimension of 100 pixels by 50 pixels. If I need this image displayed on # block1 to look smaller, can I just change the width and height of # block1 or do I need to first resize the image and then change the width and height of # block1 accordingly.

Thank you

Answer 1

You cannot in CSS1 and 2, but CSS3 supports the background-size property , which, if you set 100%, should give you what you are looking for.

, , , :)

Answer 2

CSS , . CSS, img, . .

Answer 3

no, the image will just be cropped.