uniapp之消除图片的空白占用空间

ops/2024/10/18 7:45:14/

我们在使用uniapp开发的过程中一定会遇到一个情况就是我们加载的图片总有一点空白出现在不该出现的地方代码如下

<view style="background:#ff0000;"><image style="width:100%;"src="https://t7.baidu.com/it/u=1819248061,230866778&fm=193&f=GIF" mode="widthFix"></image>
</view>

最终的展示效果如下

演示效果

是不是很烦人,代码感觉一点问题都没有,那么我们如何去解决这个问题,下面就来说一下其实这个问题解决起来也简单

<view style="background:#ff0000;font-size:0"><image style="width:100%;"src="https://t7.baidu.com/it/u=1819248061,230866778&fm=193&f=GIF" mode="widthFix"></image>
</view>

处理后图片

其实重要的就是在外围的容器上面加上font-size:0即可

写在最后还是需要我们去自己去亲身实践,多多敲敲试试总会有意想不到的效果。


http://www.ppmy.cn/ops/6461.html

相关文章

FreeLearning C/C++ 译文集翻译完成

C 高级编程C 高级编程秘籍Qt Creator 应用开发C 游戏编程入门指南C 编程入门指南Boost.Asio C 网络编程Boost C 应用开发秘籍第二版C 数据结构与算法设计原理C Qt5 GUI 编程C 高性能编程C 反应式编程C 系统编程秘籍C 研讨会C 现代嵌入式编程秘籍C 专家编程&#xff1a;成为熟练…

HackMyVM-Connection

目录 信息收集 arp nmap WEB web信息收集 dirsearch smbclient put shell 提权 系统信息收集 suid gdb提权 信息收集 arp ┌─[rootparrot]─[~/HackMyVM] └──╼ #arp-scan -l Interface: enp0s3, type: EN10MB, MAC: 08:00:27:16:3d:f8, IPv4: 192.168.9.115 S…

java解决常见递归问题

最基本的&#xff0c;斐波那契数列&#xff0c;阶乘&#xff08;0&#xff0c;1的阶乘均为1&#xff09; 返回字母“x”第一次出现的位置 使用递归编写一个函数&#xff0c;读取一个字符串&#xff0c;返回字母“x”第一次出现的位置。例如&#xff0c;字符串 "abcdefgh…

《springcloud alibaba》 六 微服务链路跟踪skywalking

目录 准备调整配置接入多个微服务网关项目调整order-seata项目stock-seata项目测试 接入网关微服务 skywalking持续化到mysql自定义链路跟踪pom .xmlorderControllerOrderServiceOrderDaoOrderTblMapper.xml测试 性能剖析日志tid打印pom.xmllogback-spring.xml日志收集启动项目…

计算机网络(王道考研)笔记个人整理——第一章

第一章 OSI/ISO参考模型 下层向上层服务&#xff0c;每一层次有特定的协议和功能&#xff0c;协议为功能服务&#xff0c;是打包和拆包的过程 物联网淑 慧试用 应用层&#xff1a;所有能和用户交互产生网络流量的程序 典型应用层服务&#xff1a;文件传输&#xff08;FTP&#…

小例子Flask网站开发—args(三)

在Flask当中args充当的角色与任务。 在 Flask 中&#xff0c;args 通常用于从 URL 查询参数中获取值。它主要用在路由函数中&#xff0c;通过 request.args.get() 方法来获取 URL 中的查询参数。以下是一些使用 args 的常见场景&#xff1a;1. 构建动态路由&#xff1a;通过在路…

CSS3 max/min-content及fit-content、fill-available值的详解

c3中对width的值多了几个值&#xff1a;fill-available, max-content, min-content, 以及fit-content。 1.width:fill-available 我们在页面中扔一个没有其他样式的<div>元素&#xff0c;则&#xff0c;此时&#xff0c;该<div>元素的width表现就是fill-availabl…

.NET 发布,部署和运行应用程序

.NET应用发布 发布.Net应用有很多种方式&#xff0c;下面列举三种发布方式&#xff1a; 单文件发布跨平台发布Docker发布 单文件发布 右键工程&#xff0c;选择“发布”&#xff0c;部署模式选择“独立”&#xff0c;目标运行时选择自己想要部署到的系统&#xff0c;我这里用…