如何使用纯 CSS 自动调整图像大小以实现响应式设计?

2024-02-24

我尝试使用 CSS 属性自动调整图像大小max-width,但它在 IE7 和 IE8 中不起作用。有没有办法在 IE7 和 IE8 中使用纯 CSS 自动调整图像大小?


Use width: inherit;使其能够在 IE8 中使用纯 CSS。 (看响应式基础.css https://github.com/ryanve/css3base/blob/master/responsive.css。) 像这样:

img {
  width: inherit;  /* This makes the next two lines work in IE8. */
  max-width: 100%; /* Add !important if needed. */
  height: auto;    /* Add !important if needed. */
}

我不确定这是否适用于 IE7,请对其进行测试并告知我们您是否正在测试 IE7。在我弄清楚之前width: inherit我使用的是下面的 jQuery,所以如果您确实需要 IE7 的支持并且第一种技术不起作用,您可以尝试一下:

<!--[if lt IE 9]><script>
jQuery(function($) {
    $('img').each(function(){
        // .removeAttr supports SSVs in jQuery 1.7+
        $(this).removeAttr('width height');
    });
});
</script><![endif]-->
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何使用纯 CSS 自动调整图像大小以实现响应式设计? 的相关文章

随机推荐

  • Lucene 与 PHP

    我可以将 Lucene 与 PHP 一起使用吗 我不想使用 Zend 我可以在本机 PHP 非框架 中使用吗 我建议使用阿帕奇SOLR http lucene apache org solr 作为您的 Lucene 后端 并通过 PHP 代
  • 如何使用 Java 8 DateTimeFormatter 更改解析两个字母年份的基准日期?

    如果我使用类似的模式d M yy用于创建 Java 8 DateTimeFormatter 例如使用DateTimeFormatter ofPattern pattern 我只会用于解析 而不是格式化 它将所有两个字母的年份解释为 20xx
  • 具有列表项选择样式的 LongListSelector

    我正在使用 Windows Phone 8 并且我有长列表选择器 其中几乎没有项目 我使用下面的代码来突出显示列表框中所选的项目 但我希望 LongListSelector 能够达到相同的效果 怎么做
  • 在确保翻译单元之间的可用性时是否不推荐使用静态?

    从以下堆栈溢出答案 https stackoverflow com a 3416755 908939 用户说 这意味着该变量是翻译单元的本地变量 简单地说 到单个源文件 并且无法从外部访问 这 事实上 当前的 C 标准不推荐使用 stati
  • OSError: [Errno 12] 使用 python 多处理池时无法分配内存

    我正在尝试使用 Python 将函数并行应用于 5 个交叉验证集multiprocessing并对不同的参数值重复此操作 如下所示 import pandas as pd import numpy as np import multipro
  • 在 CalenderView 中仅显示单个月份,并在其他月份之间进行导航

    这是这个问题的后续问题 安卓 CalendarView 一次仅显示一个月的日历 https stackoverflow com questions 33810905 android calendarview show only one mo
  • iPad 应用程序 - 以编程方式更改语言

    我有一个需要两种语言的应用程序 英语和法语 我已经在各自的 en lproj 和 fr lproj 文件夹中设置了 Localized strings 文件 当我更改 iPad 的语言 在本机设置应用程序中 然后启动我的应用程序时 它确实如
  • 如何选择包含特殊字符的id?

    我正在处理无法修改的 HTML 片段 文档中的 ID 之一是 div div 这是完全有效的HTML5 id 语法 https www w3 org TR html5 dom html the id attribute 但是 不可能在 CS
  • 使用 jquery 旋转后其他元素的错误行为

    我编写了一些用于文本旋转 调整大小和文本拖动的代码 一开始一切都工作正常 请看这段代码 new div draggable containment bord create function new div css width auto dr
  • 抱歉,Instagram API 发生错误:此端点已停用 [重复]

    这个问题已经存在了 我正在使用带有网格插件的 WordPress 网站 昨天该插件工作得很好 我添加了新的访问令牌 今天它开始向我显示此错误 抱歉 Instagram API 发生错误 此端点已停用 Insatagram 的另一项突然变化是
  • 仅在特定片段上禁用右侧抽屉

    I have Activity with DrawerLayout 其中包含左抽屉和右抽屉 我想知道是否可以禁用特定片段的右侧抽屉 我读过关于mDrawerLayout setDrawerLockMode DrawerLayout LOCK
  • 使用 splrep 平滑轨迹

    从视频记录中可以提取出物体的轨迹head行人穿过瓶颈的情景 因为 行人在移动轨迹时摇摆包含我想消除的令人讨厌的振荡 平滑算法与这个问题无关 结果显示在此figure http postimage org image mt83l9lu3 因此
  • Scrum 和 Fogbugz [关闭]

    Closed 这个问题是基于意见的 help closed questions 目前不接受答案 有人同时使用 Fogbugz 和 Scrum 吗 我们广泛使用 Fogbugz 并且我正在寻找任何可能将其用作 Scrum 一部分的人的想法 我
  • += 到底做了什么?

    我需要知道什么 在 Python 中是这样的 就是这么简单 我也希望链接到 Python 中其他速记工具的定义 在Python中 是糖衣 iadd 特殊方法 或 add or radd if iadd 不存在 这 iadd 类的方法可以做任
  • mixin 是否应该对其包含类做出假设?

    我找到了一个 mixin 的示例 它对包含类具有哪些实例变量进行假设 像这样的事情 module Fooable def calculate val one val two end end class Bar attr accessor v
  • 如何从mysql数据库在arraylist中添加超过50,000,000条记录[关闭]

    Closed 这个问题需要细节或清晰度 help closed questions 目前不接受答案 将数据库中超过 50 000 000 条记录添加到数组列表中 我添加了 30 000 000 条记录 它显示堆内存不足错误 看看这里 增加
  • 在 Android 中获取麦克风音频。音频上下文

    由于某种原因我无法得到这个问题的答案 你好 我需要访问 Android 麦克风 我使用这个在网络上制作了一个调谐器应用程序 https github com cwilso PitchDetect https github com cwils
  • .kube/config 中没有访问令牌

    在 GKE 中升级集群后 仪表板将不再接受证书身份验证 我的同事说 没问题 kube config 中有一个可用的令牌 user auth provider config access token REDACTED cmd args con
  • 玩笑测试失败:TypeError:window.matchMedia 不是函数

    这是我第一次前端测试经历 在这个项目中 我使用 Jest 快照测试并收到错误TypeError window matchMedia is not a function在我的组件内 我浏览了 Jest 文档 找到了 手动模拟 部分 但我还不知
  • 如何使用纯 CSS 自动调整图像大小以实现响应式设计?

    我尝试使用 CSS 属性自动调整图像大小max width 但它在 IE7 和 IE8 中不起作用 有没有办法在 IE7 和 IE8 中使用纯 CSS 自动调整图像大小 Use width inherit 使其能够在 IE8 中使用纯 CS