Question

如果我有图像 - 比如20 * 20像素

我可以使用此行调整图像大小 - 它会使整个图像变小：

 <img src="images/online-dating-main/blinking smile14x14.gif" width="14" height="14"/>

如何使用CSS调整大小？

我试过这个，但它只是裁剪图像：

 <div id="smile"></div>

  div#smile {
     background: url(../images/online-dating-main/smile.gif) no-repeat 0 0;
     width: 14px;
     height: 14px;
 }

如何使用CSS调整大小？

THX

Answer 1

将background-size: contain;添加到div#smile选择器。

jsFiddle

请注意，浏览器支持可能是个问题。 IE＆lt; 9不支持此属性。

Answer 2

调整img的大小而不是使用背景图像？

 <img class="resize" src="images/online-dating-main/blinking smile14x14.gif" />

CSS

.resize {
    width: 14x;
    heigh: 14px;
}

HTML CSS - 图像大小调整

2 个答案: