我想要一个已经有边框顶部和底部（1px纯灰色）的div上的边框左边（5px实心蓝色） . 我希望border-left位于border-top和border-bottom之上，但是浏览器会像这样呈现：
到目前为止我找到的唯一解决方案是将它包装在另一个div中并将左边框放在这个上，但我真的不喜欢它 .
如果有人有更好的解决方案......
@Nick在这里我如何在浏览器上看到它：
这就是我想要的方式：
可能有几种不同的方法可以做到这一点 . 您可以尝试使用新的伪元素来生成所需的边框 .
但我想我可能会选择使用box-shadow属性 . 看看我的小提琴，为了清晰起见，它有夸张的颜色和大小：
http://jsfiddle.net/5hJdA/
我使用了一个带有0模糊半径和0点差的插入框阴影 . 我还在左边添加了一个填充值，以便内容清除左边框的宽度 . 由于框阴影是插入的，因此其效果将在元素的边界边界内呈现 .
在这里发布代码，因为SO需要它（跛脚）：
element { box-shadow: 25px 0 0 0 blue inset; }
1 回答
可能有几种不同的方法可以做到这一点 . 您可以尝试使用新的伪元素来生成所需的边框 .
但我想我可能会选择使用box-shadow属性 . 看看我的小提琴，为了清晰起见，它有夸张的颜色和大小：
http://jsfiddle.net/5hJdA/
我使用了一个带有0模糊半径和0点差的插入框阴影 . 我还在左边添加了一个填充值，以便内容清除左边框的宽度 . 由于框阴影是插入的，因此其效果将在元素的边界边界内呈现 .
在这里发布代码，因为SO需要它（跛脚）：