HTML CSS - 图像大小调整
问题描述:
如果我有一个形象 - 说20个* 20个像素HTML CSS - 图像大小调整
我可以用这条线来调整图像 - 它将使整个图像变小:
<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
答
答
调整img而不是使用背景图像?
<img class="resize" src="images/online-dating-main/blinking smile14x14.gif" />
CSS
.resize {
width: 14x;
heigh: 14px;
}
我从来不依赖于浏览器做图像尺寸调整...取决于浏览器它往往看起来模糊或锯齿状。如果图像比您想要的尺寸大得多,即使您显示的尺寸较小,仍然必须下载全尺寸图像。我更喜欢在Photoshop中进行图像大小调整,并在浏览器中以100%的比例显示完整图像。 – Sparky
它看起来像你使用两个单独的图像,这将解释裁剪。你不需要那个背景剪辑或背景大小。你的CSS是正确的。你的图片uri不匹配。 – albert
我使用了带有两个参数宽度和高度的imageresize.php,你可以上传一张图片并动态获得多个大小,我还为重复的图片大小制作了一个缓存。 (文件imagesize.php)是PHP脚本,可用于图像调整大小) – 2013-01-28 10:54:16