css左右轮廓

Question

无论如何设置css outline只显示左右？因为我不能使用边框，所以我试过但会使前景更糟糕。

.test{
  margin:10px;
  padding:10px;
  width:100px;
  height:10px;
  outline:10px solid #000;
  }

<div class="test"></div>

Answer 1

您可以使用两个框阴影来实现此目的：

div {
  margin: 10px;
  padding: 10px;
  width: 100px;
  height: 10px;
  box-shadow: -5px 0px 0px 0px black, 5px 0px 0px 0px black;
}

<div></div>

Answer 2

.test{
  margin:10px;
  padding:10px;
  width:100px;
  height:10px;
  outline:10px solid #000;
  }

<div class="test"></div>

没有这样的轮廓属性可以使用边框