如何用纯 CSS 制作这一行？

【问题标题】：How to make this line in pure CSS?如何用纯 CSS 制作这一行？
【发布时间】：2022-11-19 22:07:26
【问题描述】：

我试过用这个：

border: 1px solid #7BE34A;
box-shadow: 0px 4px 25px rgba(123, 227, 74, 0.25);

border: 1px solid #28780D;
box-shadow: 0px 4px 25px rgba(40, 120, 13, 0.25);

来自 figma，但它不起作用

【问题讨论】：

你能试着澄清你的问题吗？
将问题编辑为include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem。这将帮助其他人回答问题。

标签： html css

【解决方案1】：

idk 如果这是你正在寻找的，但这是一个例子：

.line {
  border-top: 1px solid #000;
  position: relative;
  width: 100px
}

.line:after {
  content: "";
  position: absolute;
  border-right: 1px solid #000;
  height: 10px;
  right: 0;
  bottom: 0;
}

.line:before {
  content: "";
  position: absolute;
  border-top: 1px solid #000;
  height: 10px;
  width: 100px;
  right: -100%;
  bottom: 110%;
}

<div class="line">

</div>

【讨论】：