正常情况下,我们在做移动端的时候,写下边框的的时候都习惯写"border-bottom:1px solid red;"这样,但在手机上看的话,边框是不1px的,至少是2px,下面我提供一个解决方案(用伪类去做):
给父级加相对定位
.items {
//父级
position: relative;
}
然后给子元素(就是给你自己想要给边框的元素)加:
.items:before {
content: "";
position: absolute;
left: 0;
top: 0;
width: 100%;
border-top: 1px solid #ddd;
-webkit-transform: scaleY(.5);
transform: scaleY(.5);
}
在手机上都可以兼容。