移动端1像素边框

通常我们会有伪类和定位来解决1像素的问题,但是使用伪类也是有问题的,但是你可以换一种方式实现1像素边框的问题,box-shadow

 

1. 实现下边框

box-shadow: inset 0 -1px 0 0 #000;

 

2. 实现右边框

box-shadow: inset -1px 0 0 0 #000;

 

3. 实现左边框

box-shadow: inset 1px 0 0 0 #000;

 

4. 实现上边框

box-shadow: inset 0 1px 0 0 #000;

 

使用阴影设置1像素边框无法设置4个方向的边框,只能设置1一个方向的边框,也无法设置边框圆角的问题,对于这些问题还是需要做一些特殊处理的。通过设置1像素的阴影只在安卓机上有用,但是在iOS手机上因为像素太小会无法显示

posted @ 2019-03-16 12:04  前端精髓  阅读(401)  评论(0编辑  收藏  举报
在这里插入图片描述