更改CSS边框边缘如何相遇？

Question

CSS的边框边缘的样子：一个

我怎么想他们看：乙

如何做到这一点？

我尝试过使用“外部阴影”，但即使模糊设置为0，产生的左边框也明显模糊。打开其他解决方案，但最好不添加其他元素。

Answer 1

编辑，你可以使用：

box-shadow: 0 5px red; 

这显示了一个DIV使用这两种方法：

<div id="square" style="height: 50px; width: 50px; border-left: 5px solid black; border-top: 5px solid red;box-shadow: 0 5px red;"></div> 

如果您正在寻找在两个侧面的黑色边框和红色顶部和底部：

<div id="square" style="height: 50px; width: 50px; border-left: 5px solid black; border-right: 5px solid black;box-shadow: 0px 5px 0px red, 0px -5px 0px red;"></div>