微信小程序cover-image手机上不显示问题

2023-10-27

微信小程序标签cover-image,在未设置宽高的情况下,在手机上不显示,但是在微信web开发者工具上却显示。
如果我们想使图片宽高比保持一致,是图片不变形,解决方法:
在cover-image标签外放一个父容器给它设置相对定位,子元素设置绝对定位,宽,高。

 <cover-view class="img-wrap">
     <cover-image class="img" src="/pages/web/images/dialog.png"/>
 </cover-view>
.img-wrap {
    position: relative;
    width: 100%;
    padding-top: 42.3333%;
}

.img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

问题解决!

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

微信小程序cover-image手机上不显示问题 的相关文章

随机推荐

  • 微分动态规划的基本思想

    吴恩达cs229第19课 微分动态规划这一部分 看了两遍才看明白 赶紧记下来 微分动态规划是基于LQR 线性二次型 的 后者能够比较简洁地计算最优策略 但要基于一个前提 就是 t 1 时刻的状态 是 t 时刻的状态和 t 时刻采取行为的线性
  • LaTeX常用语法查询(自用)

    文章目录 LaTex文档结构 添加作者 标题 日期 章节和段落 插入目录 插入数学公式 两种插入模式 上下标和空格 根式与分式 符号 括号 省略号 矩阵 插入图片 插入表格 编辑器 离线编辑 在线编辑 分点 itemize 参考文献插入链接
  • 使用golang的pprof包对程序进行性能分析

    golang提供pprof包 可以监控golang程序的堆栈 cpu的耗时等性能信息 下边就说一下这个pprof包的使用 1 首先是引入 在两个地方可以引入 net http pprof runtime prof 其中 net http p
  • 尺寸汇总

    尺寸汇总 获取视口的宽高 含滚动条 window innerWidth window innerHeight 不含滚动条 document documentElement clientWidth document documentEleme
  • python使用matplotlib实现折线图的绘制

    一 意义 数据可视化可以以简洁的方式呈现出数据 发现众多数据中隐藏的规律和意义 Matplotlib是一个数学绘图库 利用它可以制作简单的图表 散点图 折线图 然后 将基于漫步概念生成一个更有趣的数据集 根据一系列随机决策生成的图表 本文我
  • 数据结构(9)之带权图

    1 带权图中 边带有一个数字 叫做权 它可能代表距离 耗费 时间或其他意义 2 带权图用来最常解决的问题是最短路径问题 pps 3 带权图的最小生成树中有所有的顶点和连接它们的必要的边 且这些边的权值最小 4 优先级队列的算法可用于寻找带权
  • Andriod中如何新建lunch项

    Andriod编译过程一般为 1 source build envsetup sh 加载命令 在项目根目录下 purple code a A code20211126 sdm660 目录 备注 在envsetup sh里将执行vendor和
  • 微服务 - 搭建Consul集群服务,Consul配置中心

    传统配置文件的弊端 静态化配置 例如env文件 配置文件无法区分环境 配置文件过于分散 历史版本无法查看 配置中心如何解决的呢 配置中心的思路是把项目中的配置参数全部放在一个集中的地方来管理 并提供一套标准的接口 当各个服务需要获取配置的时
  • [报名中] 腾讯技术专家为你揭秘"音视频及融合通信技术"

    导语 6月29日 北京东直门亚朵S酒店 云 社区邀您参加 音视频及融合通信技术 沙龙活动 深度探讨音视频及融合通信技术的发展及实践 领略前沿 共创价值 数字多媒体技术的不断发展对音视频及融合通信技术提出了怎样的要求呢 本期沙龙将邀请腾讯技术
  • qt中使用QStringLiteral宏来实现带参数的输出

    叙述 在QStringLiteral宏中输入字符串 但是字符串中有些值想用变量来输出 直接上代码 qDebug lt
  • futter开发错误积累

    注 后面添加以倒序方式添加 26 错误 RangeError index Invalid value Not in inclusive range 0 7 8 指示您的数组索引是从即0到7 但您正在尝试访问不存在的第8个索引的值 25 错误
  • 2021全国职业技能大赛安徽省合肥市“网络空间安全赛项”赛题及赛题解析(超详细)

    2021年中职组 网络空间安全 赛项 一 合肥市竞赛任务书 二 任务书解析 三 不懂的可以私信博主 一 合肥市竞赛任务书 一 竞赛时间 8 00 11 00 共计3小时 二 竞赛阶段 竞赛阶段 任务阶段 竞赛任务 竞赛时间 分值 第 阶段
  • SG90舵机的使用

    1 SG90舵机官方数据 尺寸 21 5mmX11 8mmX22 7mm 重量 9克 1kg 1公斤 2斤 无负载速度 0 12秒 60度 4 8V 0 002s 度 堵转扭矩 1 2 1 4公斤 厘米 4 8V 使用温度 30 60摄氏度
  • dubbo消费者源码解析

    一 服务消费者核心类ReferenceBean public void afterPropertiesSet throws Exception if applicationContext null BeanFactoryUtils bean
  • C++中类型转化

    对象类型向上向下转化 对象转化是对象间的按成员赋值 有新的存储被分配 有新对象产生 类型指针向上向下转化 转化后没有得到引得对象 也可以说没有新的存储分配 我们只是通过一个小的 转化后的对象的大小 视角去看待这个对象 因此在诸如对象的释 放
  • 网络总结知识点(网络工程师必备)一

    作者 小刘在C站 个人主页 小刘主页 每天分享云计算网络运维课堂笔记 努力不一定有收获 但一定会有收获加油 一起努力 共赴美好人生 夕阳下 是最美的绽放 树高千尺 落叶归根人生不易 人间真情 前言 本专栏为就业必修秘籍 技术分册 本张试读篇
  • 某程序员披露华为外包员工现状:工作氛围好,没有歧视,但转正后也不算正式员工?...

    有些想进互联网大厂的人在无法成为正式员工的时候 会通过成为外包员工的方式来曲线救国 但在互联网大厂中 外包员工和正式员工的差别待遇一直是比较热门的话题 最近 一个网友总结了华为外包和正式员工的区别 干货满满 先来看看 看完以后 许多人表示赞
  • iframe被拒绝_IFRAME权限被拒绝的解决方案

    iframe被拒绝 I was recently rolling my own AJAX upload script posting a form to a hidden IFRAME and using the load event to
  • TEMPLATE METHOD 模式

    Template Method 模式使用继承 来分离通用的算法和具体的上下文 简单的讲 我有一个冒泡排序的程序 用来对int 型数据排序 要想对double 类型的数据排序 可能又得重新编写一个排序程序 Template Method 模式
  • 微信小程序cover-image手机上不显示问题

    微信小程序标签cover image 在未设置宽高的情况下 在手机上不显示 但是在微信web开发者工具上却显示 如果我们想使图片宽高比保持一致 是图片不变形 解决方法 在cover image标签外放一个父容器给它设置相对定位 子元素设置绝