为什么我的背景样式被忽略了？

Question

我有一个可滚动的组件：

<div>
  <div className="scrolling-component">...</div>
  <div className="button">...</div>
</div>

在 scss 文件中我有：

.scrolling-component {
  background: linear-gradient(white 30%, rgba(255, 255, 255, 0)), linear-gradient(rgba(255, 255, 255, 0), white 70%) 0 100%, radial-gradient(50% 0, farthest-side, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)), radial-gradient(50% 100%, farthest-side, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)) 0 100%;
  height: 100px;
}

但是我检查了开发工具，好像语法有问题，我已经看了一段时间了，还没有弄清楚到底是什么问题，我在想也许这是径向渐变，感谢帮助！

Answer 1

我试过你的代码，开发工具在后台显示错误 'Invalid property value'。你忘了在径向渐变中添加 'at' ：工作梯度：

linear-gradient(white 30%, rgba(255, 255, 255, 0)), linear-gradient(rgba(255, 255, 255, 0), white 70%) 0 100%, radial-gradient(farthest-side at 50% 100%, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)), radial-gradient(farthest-side at 50% 100%, rgba(0, 0, 0, .2), rgba(0, 0, 0, 0)) 0 100%;

为什么我的背景样式被忽略了？

Why is my background styling getting ignored?

css

styling

reactjs