ie兼容图片缩小后模糊失真（锯齿）问题

最新推荐文章于 2023-02-08 09:18:30 发布
最新推荐文章于 2023-02-08 09:18:30 发布
阅读量1.3k 收藏
点赞数
文章标签： xhtml javascript ViewUI
原文链接：http://www.cnblogs.com/zhouyx/p/4189069.html
版权

解决IE下图片缩小失真（有锯齿）的问题

 

首先，这不是一个新鲜玩意儿，很多大牛08年就发现了。

其次，这是个所有IE下普遍都会遇到的问题，而非只针对于IE67。（百度了一下，大半左右的文章是针对于IE67的）。自己为什么不能试一下呢？为什么不能实事求是，实话实说呢？

先说一下：-ms-interpolation-mode:bicubic 为IE7私有属性。

interpolation

英 [ ɪnˌtəpəʊˈleɪʃən ] 美 [ ɪnˌtɚpəˈleʃən ]

n. 窜改； 添写，插补

 

bicubic

双三次

 

再说一下：VML滤镜。

VML介绍

VML的全称是Vector

最低0.47元/天 解锁文章
weixin_30319153
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
关于img标签缩小后模糊的解决方案
棉花没有糖的博客
08-25 5392
网上尝试方案： 1.image-rendering: pixelated; // 像素化，出现锯齿状，pass 2.image-rendering: crisp-edges; // 无效 3.只设置width // 无效，还是会模糊 最终解决方案： width: 100px; height: 200px; object-fit: cover; 关于很多人分不清object-fit各个参数的效果，其实根据单词含义能推测出来： 原图： 1.fill：充满 拉伸图片达到设置的宽高（在contain的基础下，哪
Aspose.Words 转图片后打印模糊 解决思路.zip
06-08
6. 代码审查：查看提供的"word转图片方法源码"，检查是否存在可能导致模糊的代码片段，如错误的缩放操作或不恰当的图像处理步骤。 7. 使用最新版本的Aspose.Words：持续更新的库往往能修复已知的问题并提供更好的...
IE浏览器下缩放后图片中的文字显示不清晰
dreamcarp的专栏
04-01 4687
在做轮播图的过程中，使用大图858＊1262px。缩放后在mac下的Chrome，Safari下图片是清晰的，但windows下Chrome浏览器中图片不是很清晰，但能接受范围内，IE浏览器中图片中的文字很难辨认。 尝试解决方案： 把png图片改为jpg格式把大图切成缩放后图片所占位置的大小190*275px把轮播图的弹窗加大，图片所占位置变大，width:40%把
IE下png格式图片失真问题
TD_1997的博客
04-16 916
页面上的png格式的图片像素很大，通过css将宽高限制，缩小显示图片后，在chrome中会显示正常， 但是在IE 浏览器下图片会出现锯齿，导致失真。 解决方法就是按照显示的大小将图片修改成对应或相近的大小，这样看起来 图片就不会失真 。 转载于:https://www.cnblogs.com/Denvue/p/10718538.html...
ie7 img指定宽高 呈现锯齿状
路漫漫 需上下求索
04-02 1666
项目中小图和大图使用了同一个图片，在IE8、firefox、chome中显示均没有问题，但在ie7中缩小显示的图有锯齿状，很伤人的一个问题。 尝试过 -ms-interpolation-mode: bicubic，没有解决问题，又尝试了 VML v\:* { behavior: url(#de
IE图标模糊怎么修复
regina的专栏
11-06 740
碰上这个故障可以通过手动重置图标缓存来解决。首先右击桌面空白处选择“属性”，切换到“外观”选项卡，点高级，在“项目”框的下拉列表中选择“图标”，改变一下图标的大小，然后再变回原设置即可。这样系统就会自动清空并重建缓存中的数据。原来的错位也就消除了。
解决IE6图片缩小后出现锯齿的问题
tenfyguo的技术专栏
01-11 2728
来自：http://www.cnblogs.com/lecaf/archive/2011/04/14/2015913.html   VML /*v\:* { behavior: url(#default#VML);}*/ .vml{ behavior: url(#default#VML);} img{width:343px;heigh
ie6 失真问题
09-28
在IE6浏览器中，网页元素的渲染经常会出现一些与现代浏览器不同的问题，这通常被称为“失真”或“兼容性问题”。在这个特定的案例中，问题出在一个隐藏的`<input type="hidden">`元素上。这个元素在HTML中位于`...
php实现等比例不失真缩放上传图片的方法
10-21
4. 处理后图片的名称 `$name`。 5. 图片的类型（例如`.jpg`） `$filetype`。 使用示例： ```php $im = imagecreatefromjpeg("./20140416103023202.jpg"); // 图片的存储路径 $maxwidth = "600"; // 设置图片的最大...
PHP自定义图片缩放函数实现等比例不失真缩放的方法
10-21
主要介绍了PHP自定义图片缩放函数实现等比例不失真缩放的方法,结合实例形式分析了php图片缩放函数的功能实现与使用技巧,需要的朋友可以参考下
（转）ie -ms-interpolation-mode: bicubic 属性详解
09-10 1210
ie -ms-interpolation-mode: bicubic 属性详解 img { -ms-interpolation-mode: bicubic; } 这个在做实时缩放图片、缩略图的时候用处挺大。IE7 Only IE7.0自带样式属性-ms-interpolation-mode 刚过完火星，从骨灰级哪里淘到的沙子。 以前很...
img标签设置图片大小后 出现模糊的情况解决
超级小恐龙~
01-18 4319
image-rendering mdn链接image-rendering - CSS（层叠样式表） | MDN CSS属性image-rendering用于设置图像缩放算法。它适用于元素本身，适用于元素其他属性中的图像，也应用于子元素。 用法 img { image-rendering:-moz-crisp-edges; image-rendering:-o-crisp-edges; image-rendering:-webkit-optimize-contrast; image-...
ms-interpolation-mode css属性
lamp专栏
11-02 5948
-ms-interpolation-mode:bicubic;ie专有属性，图片失真，firefox图片缩放失真，image-rendering属性
html5 字体自动缩放,HTML5---响应式和页面自适应问题（自动适应屏幕大小）
weixin_42469649的博客
05-30 5950
今天写app用到了页面自适应的内容，由于很久没有写过了，当时脑子也不好使了，就怎么也写不出来，最后才知道原因，页面自适应主要用于手机移动端app较多，所以，要熟练掌握！在网页的头部中增加以下这句话，可以让网页的宽度自动适应手机屏幕的宽度1width=device-widthwidth为设置layout viewport 的宽度，为一个正整数，”width-device”表示宽度是设备屏幕的宽度i...
图片CSS模糊滤镜浏览器兼容解决方法
羽筠的博客
06-03 3596
之前做过移动端页面，要求一些图片模糊，但安卓不支持CSS模糊滤镜，找了很多方法，最后找到SVG滤镜能够很好的解决此问题，以下给出应用方法： 中filter="url(#blur)" 对应 的id值
前端图片渲染到浏览器上失真 解决方法
weixin_48850727的博客
02-08 476
前端图片渲染到浏览器上失真 解决方法
Java图片缩小后不失真的代码
最新发布
05-10
可以使用 Java 中的 Image 类的 getScaledInstance() 方法来缩小图片并保持图片质量不失真。 下面是一个示例代码： ``` import java.awt.Graphics2D; import java.awt.Image; import java.awt.RenderingHints; import java.awt.image.BufferedImage; import java.io.File; import java.io.IOException; import javax.imageio.ImageIO; public class ImageResize { public static void main(String[] args) { try { // 指定原始图片路径 File originalImageFile = new File("original_image.jpg"); // 指定缩小后的图片路径 File resizedImageFile = new File("resized_image.jpg"); // 读取原始图片 BufferedImage originalImage = ImageIO.read(originalImageFile); // 计算缩小后的图片大小 int width = originalImage.getWidth() / 2; int height = originalImage.getHeight() / 2; // 创建缩小后的图片 BufferedImage resizedImage = new BufferedImage(width, height, BufferedImage.TYPE_INT_RGB); // 缩小图片 Graphics2D g = resizedImage.createGraphics(); g.setRenderingHint(RenderingHints.KEY_INTERPOLATION, RenderingHints.VALUE_INTERPOLATION_BILINEAR); g.drawImage(originalImage, 0, 0, width, height, null); g.dispose(); // 保存缩小后的图片 ImageIO.write(resizedImage, "jpg", resizedImageFile); } catch (IOException e) { e.printStackTrace(); } } } ``` 在上面的代码中，我们首先指定原始图片路径和缩小后的图片路径，然后读取原始图片。接着计算缩小后的图片大小，并创建一个缩小后的图片。使用 Graphics2D 对象绘制缩小后的图片，设置 RenderingHints 来保持图片质量不失真。最后保存缩小后的图片。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值