javascript - 如何在单色 React 中制作渐变背景？

Question

我想在 React 中为组件制作渐变背景，如下图所示

Gradient of the same colour

我想这样做:<Box colour ="blue"></Box>这些组件的样式在哪里

backgroundColor="this.props.colour"

现在我只想传递颜色属性，我不想传递两种颜色，颜色也是十六进制代码。

Answer 1

为什么不使用渐变作为 background-color 之上的图层来实现这一点:

.box{
  height:200px;
  width:200px;
  background:linear-gradient(rgba(250,0,0,0.5),transparent);
  background-color:orange /*this your primary color*/
}

<div class="box">
</div>