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 小时前
elment Table多级表头固定列后,合计行错位显示问题解决
前端·javascript·vue.js
曦月合一1 小时前
html中iframe标签 隐藏滚动条
前端·html·iframe
奶球不是球1 小时前
el-button按钮的loading状态设置
前端·javascript
kidding7231 小时前
前端VUE3的面试题
前端·typescript·compositionapi·fragment·teleport·suspense
HappyAcmen3 小时前
关于微信小程序的面试题及其解析
微信小程序·小程序·notepad++
Σίσυφος19003 小时前
halcon 条形码、二维码识别、opencv识别
前端·数据库
乔冠宇3 小时前
微信小程序修改个人信息头像(uniapp开发)
微信小程序·小程序·uni-app
学代码的小前端3 小时前
0基础学前端-----CSS DAY13
前端·css
lvbb664 小时前
微信小程序-路线规划功能
微信小程序·小程序·notepad++
css趣多多4 小时前
案例自定义tabBar
前端