最近遇到这样一个问题,在HTML5手机页面中,直接给<img>标签设置宽高,即便图片路径正常,在IOS真机下也是无法显示的,而在安卓以及浏览器的模拟真机上都是正常显示的,这是为什么呢?

html:

<img src="xxxx.png" />
//假定图片路径正常

css:

img{
width:100px;
height:100px;
}

这样,图片在安卓以及模拟真机上是能够正常显示的,而在IOS手机下无法正常显示。

有人提供给我一个解决办法,给img标签加一个父级元素,给父级元素设置宽高,然后给img标签设置宽高100%,如下:

html:

 <div class="img-container">
<img src="xxx.png" />
//假定图片路径正常
</div>

css:

   .img-container{
width:100px;
height:100px;
}
.img-container img{
width:100%;
height:100%;
}

这样图片就能在IOS手机上正常显示了,不知还有更好的办法吗?

IOS下图片不能显示问题的解决办法的更多相关文章

  1. [移动端] IOS下border-image不起作用的解决办法

    上周五突然接到现场的一个需求,做一个移动端的劳模展示页面.现场美工把原型图发了过来.这个样子的: 说实在的很想吐槽一下我们美工的审美哈,不过这不是重点. 因为边框是需要特殊花纹的所以打算用border ...

  2. 苹果IOS下text-shadow与box-shadow失效的解决办法

    加入以下样式,可以解决苹果IOS下text-shadow与box-shadow失效的问题 -webkit-appearance: none

  3. sublime text 按下Ctrl + B 显示空白的解决办法

    环境:windows xp , sublime text 2 条件:环境变量也已经设置好,可是无论怎么编译都是空白,如图: 于是鄙人百度之,发现不少网友都有这样的问题,但是网上给出的的解决方案千篇一律 ...

  4. IE6 IE7下文字显示竖排的解决办法

    IE下文字显示竖排的解决办法: white-space:nowrap;

  5. SSRS (SQL Server Report Service) 在IE9, IE10下显示不全的解决办法

    原文:SSRS (SQL Server Report Service) 在IE9, IE10下显示不全的解决办法 在做项目的过程中遇到SSRS与IE9, IE10不兼容的情况,具体表现为报表页面在IE ...

  6. HTML中的select下拉框内容显示不全的解决办法

    HTML中的select下拉框内容显示不全的解决办法 今天,我遇到这样一个问题:查询栏中的下拉框中的内容过长,导致部分被覆盖了. 查询了一些资料,有的说用函数控制,有的说用事件控制,有的看不懂,有的实 ...

  7. ios访问web页面<div>点击事件不起效果,以及alert()显示url的解决办法

    ios访问web页面<div>点击不起效果,在其div上添加style=”cursor:pointer:“ jquery web页面动态append()事件调用方法:$(document) ...

  8. SecureCRT中某些命令提示符下按Backspace显示^H的解决方法

    SecureCRT中某些命令提示符下按Backspace显示^H的解决方法 安装了Apache Derby数据库服务器之后,使用ij客户端去连接derby服务端,可是在ij中输入命令的时候,每当输入错 ...

  9. MySQL 5.7 Command Line Client输入密码后闪退和windows下mysql忘记root密码的解决办法

    MySQL 5.7 Command Line Client输入密码后闪退的问题: 问题分析: 1.查看mysql command line client默认执行的一些参数.方法:开始->所有程序 ...

随机推荐

  1. day20 logging模块、re模块

    今日内容: 1.logging模块 2.re模块 1.logging模块 -- 什么是logging模块 -- logging模块是用来进行记录日志的模块,主要作用是将想要输出的日志进行分级,然后以不 ...

  2. [官网] 一个很好的 search rpm 或者是deb 包的网站

    https://pkgs.org Home About About pkgs.org - Packages Search The pkgs.org is created to provide you ...

  3. Recordset对象的Open方法

    Recordset对象的Open方法原型: Open([Source],[ActiveConnection],[CursorType],[LockType],[Options]) CursorType ...

  4. Synchronized与Lock的区别与应用场景

    转载. https://blog.csdn.net/fly910905/article/details/79765381 同步代码块,同步方法,或者是用java提供的锁机制,我们可以实现对共享资源变量 ...

  5. 深入应用C++ 11 C2

    template<typename T> void print(T& t) { cout << "lvalue" << endl; } ...

  6. Thinkphp5 自定义上传文件名

    这几天在做tp5的上传文件模块,项目需求是要把文件名在上传之后修改为 用户名+原文件名的组合形式,在网上找了一会儿发现好像没有类似的文章...只好自己去研究研究了. 之前查看过看云上面的官方手册,文件 ...

  7. 斜率优化DP(转载)

    转载自:https://www.cnblogs.com/ka200812/archive/2012/08/03/2621345.html 我们知道,有些DP方程可以转化成DP[i]=f[j]+x[i] ...

  8. Python基础(九)--函数

    函数的作用 减少重复代码 程序易于维护 程序易于扩展 函数的定义 >>> def calculate(x,y): #定义函数名为calculate,参数为x和y result = x ...

  9. WebMvcConfigurationSupport跨域和fastjson全局替换

    @Configuration public class WarnWebMvcConfigurationSupport extends WebMvcConfigurationSupport { /** ...

  10. opencv+ linux + cmake 生成 opencv静态库

    您可以省去如下步骤,直接下载我编译好的: http://download.csdn.net/detail/u011258240/9710331 一.编译opencv2.4  不带contrib 1. ...