Question

有没有办法使HR基本上是从左到右的三角形？因此，您可能在左侧有一个7像素的底部，但在右侧却缩小到了1像素（垂直居中）？

我尝试使用线性渐变来完成此操作，但是我无法使用它来完成2个二维渐变。

Answer 1

您应该可以使用剪切路径来做到这一点。

hr {
  height: 7px;
  width: 100%;
  background: black;
  border: 0;
  clip-path: polygon(100% 50%, 0 0, 0 100%);
}

<hr />