关于IE加载img会自动给标签添加width和height

最新推荐文章于 2021-09-05 09:35:22 发布
最新推荐文章于 2021-09-05 09:35:22 发布
阅读量472 收藏
点赞数
分类专栏： CSS 文章标签： IE CSS
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/yotcap/article/details/103118642
版权

兼容IE的开发中，碰到图片标签莫名其妙被添加上width和height的属性，导致图片被拉伸变形。
示例截图

解决办法

在根样式文件中添加如下规则：

img {
  width: auto;
  heigth: auto;
}

原因

具体的原因没有细查，根据这位老哥所说，IE在没有为同时设置CSS的width&height时，会把图像实际宽高赋值给width&height属性，从而影响布局，尤其是使用2倍大小。
参考自：https://segmentfault.com/q/1010000007398885

yotcap
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
img标签在ie浏览器下的兼容处理
u011705317的专栏
07-03 4982
html代码片段         css代码片段 ul{width:280px} ul li{display:block;height:57px;width:277px}
Android开发实现webview中img标签加载本地图片的方法
01-20
本篇文章将详细讲解如何在Android的Webview中通过img标签加载本地图片。 首先，我们要明确两个关键步骤： 1. **配置Webview设置**： 为了让Webview能够正确地读取和访问本地文件系统，我们需要修改Webview的设置...
IE自动给图片加上width和height属性的修复
qq_39684484的博客
09-05 108
# IE自动给图片加上width和height属性的修复 作者：吴业飞 时间：2018.07.25 ## 情景再现 在项目中写了一个图片列表，再普通不过的一行3张图，用的是栅格布局，`html`代码大概如下 <div class="row"> <div class="col-md-4"><img src="" alt=""></div> <div class="col-md-4"><img src="" alt=""&g
在outlook中设置<img>大小
ForMyQianDuan的博客
12-30 3907
在outlook中，用style设置img标签大小时，比如你是200px宽高的图， style=”width:200px; height:200px;” 这么定义在outlook就没用。你会发现设置未生效。 查资料后发现要这么操作。把style中定义的width和height提取到style 之外，并且不加长度单位。  width=”200” height=”200”。这样就行了。
[原创] ie中img被拉伸，自动为width，height赋值
大象的博客
07-06 4014
需求：人脸照片展示 说明：cs端上传图片，在web上展示。由于只对图片大小，格式进行判断，而无法控制图片形状。效果如下 如果没有图片，即展示默认图片。默认图片是350px*250px大小，和外面的div是保持一致大小. &lt;div class="boxImg"&gt; &lt;img class="imgContent userMgrImg" :src="facePicPa...
解决IE浏览器，img的src加载图片问题
lovlin_l的代码世界
10-21 1万+
在“强大的”IE浏览器面前，有个BUG，就是当你界面访问后台数据的时候，加载不出来，但是请求头是有东西的。如果遇到这种问题，以下是解决办法 在你后端访问的action里找到所请求的方法：设置图像的mime类型就可以了。MagicMatch 对象依赖的jar包，在pom里导入即可     net.sf.jmimemagic     jmimemagic     0.1
兼容ie、firefox的图片自动缩放的css跟js代码分享
10-28
总结来说，通过CSS的`max-width`和`max-height`属性以及针对IE6的JavaScript兼容性处理，我们可以实现图片在各种浏览器下的自动等比例缩放，保持页面整洁美观。在实际应用中，还应考虑优化代码以提升用户体验，如...
CSS HACK收集：关于IE6/FF/google等浏览器hack的方法详细
09-25
解决方法是为img标签添加样式`border:0 none;`以消除边框。此外，可以使用条件注释如`<!--[if lte IE 6]>`来专门针对IE6及以下版本加载特定CSS样式，但这可能导致额外的HTTP请求。 2. **CSS选择器区分**： IE6不...
ie8.0下显示本地图片的js实现代码 img.src
10-28
<div id="imgPreview"><img id="img1" width="120px" height="100px" /> function PreviewImage(imgFile) { var filextension = imgFile.value.substring(imgFile.value.lastIndexOf("."), imgFile.value....
html字符串img添加style,js 匹配 img标签 增加 style样式
weixin_40003283的博客
06-15 1901
给img标签增加 style样式：1、如果img 标签没有style 就先添加style标签2、添加标签后统一再添加style样式function imgTagAddStyle (htmlstr) {// 正则匹配所有img标签 // var regex0 = new RegExp("(i?)(\]+\>)","gmi");// 正则匹配不含style="" 或 style=''...
IE浏览器中< img ... />标签不显示图片
热门推荐
GongHao2014的专栏
10-10 1万+
IE浏览器< img … /> 不显示问题描述：<!-- 代码部分 --> <html> <head> <meta charset="UTF-8"> <title>演示</title> </head> <body> <h1>演示</h1> <img src="1.png" width="295" height="
IE对img.width支持不好
cxzhq2002的杂记
11-10 2572
  function DrawImage(ImgD){   var image=new Image();   var iwidth = 500; //img.width支持不是很好，所以借助中间对象，且对src的支持好，有时alert(width)的支持会是o, 而alert(this.src)一定会是正确的值,而firFox绝对没有这个问题。  image.src=ImgD.src;   if(
详解 height 和 width 属性
weixin_30387423的博客
04-02 763
为什么要使用 height 和 width 属性您是否见过当文档加载时其内容会显示不规律的移动。之所以会这样，是因为浏览器为了能够显示每一个加载的图像，而不断地重新调整页面的布局。浏览器通过下载并解析出图像的宽度和高度来决定图像的大小，然后就会在显示窗口中留出一个相应的矩形空间。然后浏览器就会调整页面的显示布局，以便把图像插入到显示当中。这同时也告诉我们，图像是独立的文件，它与源文件都分别是独立加...
IMG标签在IE9浏览器下显示图片的问题
weixin_33750452的博客
07-26 423
2019独角兽企业重金招聘Python工程师标准>>> ...
100款古风PPT (80).pptx
最新发布
07-13
【ppt素材】工作总结、商业计划书、述职报告、读书分享、家长会、主题班会、端午节、期末、夏至、中国风、卡通、小清新、岗位竞聘、公司介绍、读书分享、安全教育、文明礼仪、儿童故事、绘本、防溺水、夏季安全、科技风、商务、炫酷、企业培训、自我介绍、产品介绍、师德师风、班主任培训、神话故事、巴黎奥运会、世界献血者日、防范非法集资、3D快闪、毛玻璃、人工智能等等各种样式的ppt素材风格。 设计模板、图片素材、PPT模板、视频素材、办公文档、小报模板、表格模板、音效配乐、字体库。 广告设计：海报，易拉宝，展板，宣传单，宣传栏，画册，邀请函，优惠券，贺卡，文化墙，标语，制度，名片，舞台背景，广告牌，证书，明信片，菜单，折页，封面，节目单，门头，美陈，拱门，展架等。 电商设计：主图，直通车，详情页，PC端首页，移动端首页，钻展，优惠券，促销标签，店招，店铺公告等。 图片素材：PNG素材，背景素材，矢量素材，插画，元素，艺术字，UI设计等。 视频素材：AE模板，会声会影，PR模板，视频背景，实拍短片，音效配乐。 办公文档：工作汇报，毕业答辩，企业介绍，总结计划，教学课件，求职简历等PPT/WORD模板。
多旋翼飞行器设计与控制理论 -第15讲_展望V2.pdf
07-13
多旋翼飞行器设计与控制理论 -第15讲_展望V2.pdf
光伏项目设备资产配置方式论证报告.doc
07-13
光伏项目设备资产配置方式论证报告.doc

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值