由于这个DPR的原因
我们在移动端写的
border:1px solid #ddd
在6plus上其实是3个像素(DPR=3)
在不同DPR的设备上显示是不一样的
@media (-webkit-min-device-pixel-ratio:1.5),(min-device-pixel-ratio:1.5){ .border-1px{ &::after{ -webkit-transform: scaleY(0.7); transform: scaleY(0.7); } } } @media (-webkit-min-device-pixel-ratio:2),(min-device-pixel-ratio:2){ .border-1px{ &::after{ -webkit-transform: scaleY(0.5); transform: scaleY(0.5); } } } @media(-webkit-min-device-pixel-ratio:3),(min-device-pixel-ratio:3){ .border-1px{ &::after{ -webkit-transform: scaleY(0.33); transform: scaleY(0.33); } } }
border-1px($color) position:relative &:after display:block position:absolute left:0 bottom :0 width:100% border-top: 1px solid $color content:‘‘
时间: 2024-10-29 03:23:10