uni-app h5端移动端1px边框过粗的根本原因是devicepixelratio≥2时浏览器将1px拉伸为多物理像素，最稳方案是::after+scaley(0.5)，需严格满足：父元素position: relative、transform-origin: 0 100%、加-webkit前缀、content非空、background-color显式声明、pointer-events: none。
uni-app 的 H5 端在移动端显示 1px 边框过粗，根本原因不是框架问题，而是浏览器渲染机制 —— window.devicePixelRatio ≥ 2 时，border: 1px 会被拉伸为 2+ 物理像素，抗锯齿后视觉发虚、偏粗。直接写 border-width: 0.5px 在多数安卓 WebView 和 iOS Safari 12–14 中会被忽略或取整为 1px，不可靠。
::after + transform: scaleY(0.5) 必须加的约束条件
这是 uni-app H5 端最稳、兼容性最好的方案，但漏掉任意一条都会失效：
- 父元素必须声明
position: relative，否则::after会脱离上下文定位到body -
::after的transform-origin必须显式写成0 100%（左下角），不能依赖默认值，iOS Safari 12–15 对无前缀或写法不严谨的transform-origin支持不稳定 - 必须加
-webkit-transform和-webkit-transform-origin前缀，否则部分 iOS 旧版本不生效 -
::after的content不能为空字符串（content: ''可以），且background-color必须显式指定，无法继承父级颜色 - 务必加
pointer-events: none，否则某些安卓 WebView 下伪元素会拦截点击事件
uni-app 中怎么写单边 1px（比如底部边框）
适用于列表项、卡片分隔线等常见场景，代码需直接写在 .vue 文件的 <style></style> 块中（不推荐全局样式，避免污染）：
.border-bottom-1px {
position: relative;
}
.border-bottom-1px::after {
content: '';
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 1px;
background-color: #e5e5e5;
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
-webkit-transform-origin: 0 100%;
transform-origin: 0 100%;
pointer-events: none;
}
注意：height: 1px 是 CSS 像素单位，缩放后才对应 1 物理像素；别用 border-bottom: 1px，它受盒模型影响，缩放后边缘易模糊。
四边都加 1px 边框时 box-sizing 容易被忽略
如果要用伪元素画四边框（如卡片外边框），不能简单套用单边逻辑：
- 伪元素需设
top: 0; left: 0; right: 0; bottom: 0;，再配合width: 200%; height: 200%+transform: scale(0.5)铺满 - 必须显式声明
box-sizing: border-box，否则默认content-box会让边框外扩，缩放后四角错位、边缘溢出甚至出现半像素黑线 -
transform-origin改为0 0（左上角），确保锚点稳定，不因内容变化偏移 - 父容器若有
overflow: hidden，缩放后的伪元素可能被裁——因为缩放基于原始尺寸计算，坐标系未同步收缩；此时应改用clip-path: inset(0)替代
box-shadow 模拟单边只适合轻量分隔场景
当不需要精确控制边框位置（如 input 下划线、列表项之间线），box-shadow 是更轻量的选择，不触发重排、无缩放副作用：
- 写法是
box-shadow: 0 1px 0 rgba(0, 0, 0, .12)，其中1px是物理像素（截至 2026 年 5 月仍被主流浏览器稳定支持） - 不支持四边同时模拟（多层
box-shadow在低版本安卓上易糊成一片） - 颜色只能是单色，无法实现渐变、虚线或圆角边框
- 真正容易被忽略的是：它无法和
border-radius共存 —— 圆角区域的阴影会断裂，此时必须退回伪元素方案
真正复杂的地方不在缩放值本身，而在伪元素的定位锚点、盒模型约束和渲染上下文 —— 这些细节在真机调试时稍有偏差，就会导致边框漂移、露白或消失。
