小程序的小bug(三)--------------------border 1px 在iphone6下显示的问题

不仅仅是小程序  手机端h5均为如此,所以可以采用以下方法

//如果是竖线。用个div代替

.border {
height: 80 rpx;
width: 0.5px;
background-color: #999;
align-items: center;
}

更好的方法在下方。。。。

//如果是横线,可以用伪类缩放的方法

.course-box::after{
width: 720 rpx;
margin-top: 30 rpx;
content: " ";
height: 1px;
border-top: 1px solid #ededed;
color: #D9D9D9;
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
-webkit-transform: scaleY( 0.5 );
transform: scaleY( 0.5 ); /*缩放*/
}

这样就可以了,竖线也可以用类似的方法,这里就不再赘述,感兴趣的看一下

使用css3做0.5px的细线 cover by Johnny丶me

https://blog.csdn.net/tyro_java/article/details/52013531


Johnny丶me

猜你喜欢

转载自blog.csdn.net/yuanye12215619/article/details/80533874