html - 如何使背景从顶部和底部略微淡化？

Question

我一直在尝试使 <div> 的顶部和底部略微褪色的背景，但每次它都几乎消失到中间，这不是我想要的。

我想把这两个的边界弄糊涂 <div>

background: linear-gradient(white, #c3faec, white);

已使用它并尝试更改两种颜色的 % 但没有成功。

Answer 1

为每种颜色设置明确的开始和停止距离，然后将中间颜色设置在两个位置，使其在该区域固定。

div {
  height: 90vh;
  margin: 5vh;
  background: linear-gradient(white 0%, red 10%, red 90%, white 100%);
}

<div></div>