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;

}

相关推荐
木斯佳1 天前
前端八股文面经大全:携程前端一面(2026-04-17)·面经深度解析
前端·状态模式
Java后端的Ai之路1 天前
LangChain ReAct Agent 核心技术问答
前端·react.js·langchain
码喽7号1 天前
Vue学习七:MockJs前端数据模拟
前端·vue.js·学习
NotFound4861 天前
探究分享从对话到执行:OpenTiny NEXT 如何重塑前端智能化开发范式
前端
小满zs1 天前
Next.js精通SEO第二章(robots.txt + sitemap.xml)
前端·seo
kyriewen1 天前
你的首屏慢得像蜗牛?这6招让页面“秒开”
前端·面试·性能优化
算是难了1 天前
Nestjs学习总结_3
前端·typescript·node.js
RONIN1 天前
VUE开发环境配置基础(构建工具→单文件组件SFC→css预处理器sass→eslint)及安装脚手架
vue.js
yogalin19931 天前
如何实现一个简化的响应式系统
前端