uniapp微信小程序1rpx border在某些手机机型上边框显示不出来解决方案

小程序在ios系统中,如果border小于1px的情况下,border就可能显示不全(可能少了上下左右任意一边)

只需要加一个::after或::before伪类,使用绝对定位定在原来元素上边就不会产生问题了!

.d_card_line1_tag {

padding: 1rpx 14rpx;

/* border: 1px solid #333; */

font-size: 18rpx;

position: relative;

}

.d_card_line1_tag::after{

content: '';

position: absolute;

left: 50%;

top: 50%;

width: 100%;

height: 100%;

transform: translate(-50%,-50%);

border: 0.5px solid #333;

border-radius: 4rpx;

}

相关推荐
傅里叶19 小时前
SchedulerBinding 的三个Frame回调
前端·flutter
小小前端_我自坚强19 小时前
React Hooks 使用详解
前端·react.js·redux
java水泥工19 小时前
基于Echarts+HTML5可视化数据大屏展示-车辆综合管控平台
前端·echarts·html5·大屏模版
aklry19 小时前
elpis之学习总结
前端·vue.js
笔尖的记忆19 小时前
【前端架构和框架】react中Scheduler调度原理
前端·面试
_advance19 小时前
我是怎么把 JavaScript 的 this 和箭头函数彻底搞明白的——个人学习心得
前端
右子19 小时前
React 编程的优雅艺术:从设计到实现
前端·react.js·mobx
清灵xmf20 小时前
npm install --legacy-peer-deps:它到底做了什么,什么时候该用?
前端·npm·node.js
超级大只老咪20 小时前
字段行居中(HTML基础语法)
前端·css·html
IT_陈寒21 小时前
Python开发者必看!10个高效数据处理技巧让你的Pandas代码提速300%
前端·人工智能·后端