美文网首页
vue移动端项目在ios上图片不显示问题

vue移动端项目在ios上图片不显示问题

作者: 前端阿良古 | 来源:发表于2019-06-15 15:59 被阅读0次

问题描述

vue移动端项目图片,在电脑和安卓预览都没问题,但是在ios系统上出现了图片显示不出来的问题。

原因

恕我直言(原谅我水平不足),并没有找到原理上的问题,只找到了表面的原因,即在样式表style中写了img{}来设置图片样式

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

解决方案

  1. 使用figure标签把img标签包裹起来,并在img行内设置width="100%"
<figure>
  <img src="@img/btn_camera.png" alt="相机" width="100%">
</figure>
  1. figure标签设置你想要的样式
figure{
  width: 130px;
  height: 130px;
}
  1. figure标签有一个默认的margin,把它清除掉
figure{
  margin: 0;
}

相关文章

网友评论

      本文标题:vue移动端项目在ios上图片不显示问题

      本文链接:https://www.haomeiwen.com/subject/ysmbfctx.html