css左右轮廓

Fee*_*htz 7 css css3

无论如何设置css outline只显示左右?因为我不能使用边框,我试过但它会使更糟糕的前景.

.test{
  margin:10px;
  padding:10px;
  width:100px;
  height:10px;
  outline:10px solid #000;
  }
Run Code Online (Sandbox Code Playgroud)
<div class="test"></div>
Run Code Online (Sandbox Code Playgroud)

jbu*_*483 26

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

div {
  margin: 10px;
  padding: 10px;
  width: 100px;
  height: 10px;
  box-shadow: -5px 0px 0px 0px black, 5px 0px 0px 0px black;
}
Run Code Online (Sandbox Code Playgroud)
<div></div>
Run Code Online (Sandbox Code Playgroud)

  • 完美的!奇迹般有效! (2认同)
  • @Andrew 不太确定你的意思?[Box-shadow](https://developer.mozilla.org/en-US/docs/Web/CSS/box-shadow) CSS 属性允许您在单个声明中应用多个值。 (2认同)