移动端1像素边框

Posted 2021-02-13 wuxianqiang

通常我们会有伪类和定位来解决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一个方向的边框，也无法设置边框圆角的问题，对于这些问题还是需要做一些特殊处理的。