border设置无效

Question

同时设置border-top: 1px solid rgba(255, 255, 255, 0.2); border-bottom: 1px solid rgba(255, 255, 255, 0.2),会导致两个都失效，只要两者属性值有一个不同，就不会有问题，这是什么原因

测试后发现，只有当颜色带有透明度时才会出现这种情况

代码简单版本如下，只要将b的透明度改成0.21就有效

.a {

    border-bottom: 1px solid rgba(0, 0, 0, 0.2);

}

.b {

    border-top: 1px solid rgba(0, 0, 0, 0.2);

}

触发一个逻辑时，a b同时生效，不然只生效a

Answer 1

我测试没问题啊，贴代码看看

有可能是因为你颜色是白色还0.2的透明度，看不清而已，试试换一个深一点的颜色测试一下

Answer 2

没有啊，你看看你是不是线重合了

Answer 3

我遇到这情况蛮多次哎 就是一个元素只设置上下边框 用rgba就会冲突 开发者工具栏里样式上显示的是正常的 取消任意一条边框 另一条都能正常显示 换成rgb就不会