【问题标题】:Resizing images based on their original size with CSS使用 CSS 根据原始大小调整图像大小
【发布时间】:2012-11-10 04:52:26
【问题描述】:

我正在为移动和桌面用户制作一个响应式博客(一体化)。关于图像大小调整,我知道我可以使用 width:100%;高度:100%;以便它们根据页面大小按比例缩放,但我注意到较小的图像会放大以适应它所在的 DIV 的宽度。假设我的 DIV 的最大宽度为 640px,但我包含在其中的图像500 像素。

我可以使用什么 CSS 将图像保持在 500 像素,然后在分辨率宽度低于 500 像素时按比例缩小?

我之所以问这个问题是因为并非帖子中的所有图片都可能是 640 像素宽。

【问题讨论】:

  • 使用标准 css 无法做到这一点。它不是这样可编程的。但是,一些 js 和/或服务器端图像检测代码可以动态调整 css 值来执行此操作。
  • 看来我必须妥协并为较小的图像使用替代方案。

标签: css


【解决方案1】:

将您的图像max-width 属性设置为实际图像大小。

【讨论】:

    【解决方案2】:

    为什么不直接设置 max-width:100% 并关闭宽度。

    【讨论】:

      猜你喜欢
      • 2017-03-03
      • 1970-01-01
      • 1970-01-01
      • 2020-12-21
      • 2013-04-19
      • 2014-12-06
      • 2013-08-28
      • 2018-01-25
      • 2012-08-07
      相关资源
      最近更新 更多