【问题标题】:Is there a way to make the ultimate responsive image? [duplicate]有没有办法制作最终的响应式图像? [复制]
【发布时间】:2015-07-03 01:17:20
【问题描述】:

多年来,我一直在制作网站和其他在线项目,当一切都在表格中完成时,我就开始了。多年来,我目睹了一切变化,现在我认为最好的网站是那些真正响应式的网站。但是,对我来说一直有一个限制,也许这已经完成了,但我似乎找不到它。

我希望看到的可能是有一些代码,即使它是 JQuery,本质上是这样的:

img {
width: 100%;
max-width: **The ACTUAL image's width**;
}

是否有一些神奇的代码或技巧可以让网站制作我发布的图片永远不会破坏我的设计(width: 100%; 部分,所以它也是响应式的),但如果我上传的图片小于容器,永远不会超过图像本身的实际宽度。我知道我可以在max-width 上设置一个特定的宽度来强制调整图像大小,但这感觉有点过分......对我来说很奇怪。我目前正在制作的页面是针对 wordpress 的,用户有时只会在帖子中上传图片,我希望图片能够响应,但只能在缩小方面做出响应,从不增长。那么,你们中的任何超级天才都知道实现这一点的方法吗?

谢谢!

【问题讨论】:

  • 切换它,只需使用max-width: 100% 然后如果容器小于图像它会响应,但如果它大于图​​像它不会响应
  • 图像永远不会大于容器。 max-width 不会告诉图像获取容器的大小并向上调整大小。对我来说,你的问题毫无意义。如果图像小于其容器,它将填充其部分。如果它更大,它将向下调整大小。
  • 你说得对,我刚刚测试了这个特定的理论,它运行良好。抱歉,显然我没有对此进行足够的研究。

标签: jquery html css image


【解决方案1】:

只需将其最大宽度设置为 100% 并省略宽度

【讨论】:

  • 反对的选民愿意发表评论吗?
  • 我投了赞成票,因为它不值得投反对票
猜你喜欢
  • 1970-01-01
  • 2021-12-14
  • 1970-01-01
  • 1970-01-01
  • 2017-01-04
  • 1970-01-01
  • 2021-09-28
  • 2014-06-21
  • 1970-01-01
相关资源
最近更新 更多