【uniapp/uview】解决 u-collapse 展开折叠的小箭头在有些型号的手机上不显示

引入:

使用 uview1 版本的 u-collapse 折叠面板组件时,需要更改它自带的小箭头的样式,更改之后在有些型号的手机上不显示;

最终样式:

分析:

原生的样式长这样:

观察样式后发现使用的是 unicode 字符,但是改了之后仍然不生效;

解决:

最后没有用 content,用了背景图片:

javascript 复制代码
::v-deep .uicon-arrow-down:before {
    // content: '⏷';
    // font-size: 20px;
    color: #929199;
    display: inline-block;
    width: 15px;
    height: 15px;
    background: url('../../../../static/gzt/AK-LN.png') center/contain no-repeat;
}
相关推荐
剪刀石头布啊6 小时前
vue-react为何要虚拟dom
前端
剪刀石头布啊6 小时前
ahooks常用的一些库,我们使用一下
前端
剪刀石头布啊6 小时前
从git更新本地提交记录到更新已经推送到远端记录
前端
云浪7 小时前
Go 并发实战:从零实现一个高并发安全的任务调度器
javascript·后端·go
Flynt8 小时前
axios 被投毒半年后,我把 npm 的"安全防线"实测了一遍:最信任的 SHA512 是安慰剂
前端·npm·node.js
excel8 小时前
Base62 和 Base64 有什么区别?
前端
风骏时光牛马9 小时前
大模型底层架构与AI源码深度剖析
前端
掘金挖土10 小时前
前端手摸手跑路之 AI 应用开发(九)
前端·后端
中文呀13 小时前
三维 GIS 离线缓存实战:逆向 CesiumOfflineCache,并亲手为它补上"自动更新"能力
前端