最近遇到这样一个问题,在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. Linux系统定时任务介绍

    定时任务Crond介绍 1)crond是什么? 守护进程:持续运行的程序,不退出的进程. 为什么要使用crond定时任务呢? 1)Linux下定时任务的种类 at crontab  anacron 2 ...

  2. 快速排序的js实现

    该方法的基本思想是: 1.先从数列中取出一个数作为基准数. 2.分区过程,将比这个数大的数全放到它的右边,小于或等于它的数全放到它的左边. 3.再对左右区间重复第二步,直到各区间只有一个数. var ...

  3. Java-Redis Serializable序列化

    在Java中使用redis存储User对象时,进行JUnit测试时,控制台: 2019-06-24 16:56:45.520 INFO 27688 --- [ main] j.LocalContain ...

  4. crontab中的%

    crontab中的%是换行的意思,在使用时需要使用\做转义. ----------------- 在用crontab执行一段定时任务时,想要把数据输出到一个日期命名的文件中 * * * * * cd ...

  5. T100——读取系统程序临时表数据

    SELECT   * FROM   USER_OBJECTS ORDER  BY  CREATED DESC SELECT   * FROM   USER_OBJECTS WHERE  OBJECT_ ...

  6. http请求之of_ordering_json

    //Public function of_ordering_json (string as_json,ref string as_jsons[]) returns integer //string a ...

  7. jenkins+docker+git+etcd实现应用配置文件管理

    两台机器: 一台机器安装gitlab: http://www.cnblogs.com/cjsblogs/p/8716932.html 另一台机器安装etcd+docker+jenkins jenkin ...

  8. windows上pip安装及使用详解

    windows上pip安装及使用详解 2018-11-21 19:49:58 十二笔 阅读数 8229更多 分类专栏: Python学习   版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA ...

  9. [git] Updates were rejected because the tip of your current branch is behind its remote counterpart.

    场景 $ git push To https://github.com/XXX/XXX ! [rejected] dev -> dev (non-fast-forward) error: fai ...

  10. vue开发后台管理系统有感

    使用vue开发后台近一个月,今天终于完成得差不多了,期间也遇到很多的问题,所以利用现在的闲暇时间做个总结 使用element-ui基础,这次使用了vue-element-admin(github地址) ...