当前位置: 首页 > 面试题库 >

在IE6中使用一个(CSS)尺寸缩放图像时如何保持长宽比?

符懿轩
2023-03-14
问题内容

这是问题所在。我有一张图片:

<img alt="alttext" src="filename.jpg"/>

注意未指定高度或宽度。

在某些页面上,我只想显示一个缩略图。我无法更改html,因此我使用以下CSS:

.blog_list div.postbody img { width:75px; }

哪一个(在大多数浏览器中)制作的页面具有统一的宽缩略图,所有缩略图均保留长宽比。

但是在IE6中,图像仅按CSS中指定的尺寸缩放。它保留了“自然”的高度。

对于所有建议,我将非常感谢,但我想指出一点(由于所选平台的客户端的局限性),我正在寻找不涉及修改html的内容。CSS也比javascript更可取。

编辑:应该提到图像的大小和纵横比不同。


问题答案:

亚当·卢特(Adam Luter)给了我这个主意,但实际上却很简单:

img {
  width:  75px;
  height: auto;
}

IE6现在可以很好地缩放图像,这似乎是所有其他浏览器默认使用的图像。

谢谢你的两个答案!



 类似资料:
  • 我有一个使用CSS flexbox缩放到可用高度的DIV。在这个DIV中,我想在两个维度上与DIV一起缩放图像。这意味着它应该被缩放以保持其长宽比,并且小于相应DIV维度的维度应该居中。 我可以使图像跟随DIV的宽度,但不能跟随高度。因此,肖像图像脱离DIV界限。 这里有一个jsFiddle来演示这个问题。

  • 问题内容: 基本上,我想上传图像(已排序)并将其按比例缩小到某些限制,例如最大宽度和高度,但要保持原始图像的纵横比。 我没有在服务器上安装Imagick-否则这很容易。 一如既往地提供任何帮助。谢谢。 编辑:我不需要整个代码或任何东西,只是朝着正确的方向推进将是很棒的。 问题答案: 我为完成的另一个项目编写了这样的代码。我已在下面复制了它,可能需要修补一下!(它确实需要GD库) 这些是它需要的参数

  • 问题内容: 目前,我正在使用: 尽管此方法可行,但最终得到的图像大小不同(有些是纵向的,有些是横向的),但是我希望所有图像都具有精确的尺寸。也许是明智的选择? 更新: 我不介意裁剪图像的一小部分。当我说明智的耕作时,我的意思是这样的算法: 问题答案: 这是我对图像进行填充拟合的观点: 它首先使用缩略图操作将图像降低到原始范围内并保留宽高比。然后将其裁剪掉以实际填充边界的大小(因为除非原始图像为正方

  • 这是我的xml代码: 这是我的java代码,它在listview中: 问题是,我想将调整大小的位图放入位图,但imageview始终显示为正方形。位图的大小为:X:4160 Y:3120,屏幕大小为:宽度=1080高度=1776 我想将宽度填充父级并调整高度以保持长宽比。我尝试了一些xml替代方案,如“ScaleType”。 有人知道正确放置位图的方法吗?

  • 问题内容: 我想创建一个div可以随窗口宽度变化而改变其宽度/高度的。 是否有任何CSS3规则可以允许高度根据宽度而改变,同时保持其长宽比? 我知道我可以通过JavaScript来做到这一点,但我宁愿只使用CSS。 问题答案: 只需使用百分比值创建包装器,如下所示: 它将导致高度等于其容器宽度的75%(长宽比为4:3)。 这取决于以下事实: 相对于生成的盒子的包含块的宽度计算百分比(来源:w3.o

  • 如何使用蜡染 (1.7) 获取 SVG 图像的大小(宽度/高度)? 该示例可以直接执行,并从开放的clipart.org下载图像。除了绝对尺寸,我还对图像的长宽比感兴趣。