Question

我有一个背景图片，我希望线性渐变在顶部和底部。我认为我拥有的CSS应该可以工作，但我只能让顶级渐变起作用。在功能div下面有一个div，我想知道这是不是搞乱了什么？我现在正在猛烈抨击：D

var filteredElements = 
    elements.Where(el => 
    {
        return el.attributes.Any(at => at.Categories.Any(ca => ca.Name.Equals("Alarm")));
    }).ToList();

链接：https://docs.oracle.com/javase/7/docs/api/java/util/StringTokenizer.html

Answer 1

您应该将多个渐变色标与多个背景定义组合在一起，并使用逗号分隔符，而不是将一个背景图像规则覆盖到另一个。这是您的用例的代码：

http://codepen.io/MakiBM/pen/NRaWrr

.bg {
  ...
  background-image: 
    linear-gradient(to bottom, white, transparent 40%, transparent 60%, white),
    url('https://a2ua.com/mountains/mountains-007.jpg');
  background-size: cover;
  background-position: center;
}

关于这两种技术的一些资源：

https://developer.mozilla.org/en-US/docs/Web/CSS/linear-gradient

http://www.css3.info/preview/multiple-backgrounds/

Answer 2

谢谢你们，你们是对的Bartek，我给了div的背景渐变，而不是实际的背景图像。背景规则太多了。

  background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.000000001), rgba(255, 255, 255, .99)),
                url('assets/Background_Features.jpg');

为我工作。

Answer 3

我使用this在CSS中生成渐变颜色，首先尝试使用没有任何webkit。

为什么我的顶部线性渐变工作但不是底部？

3 个答案: