CSS:如何翻转这个线性渐变？

Question

我有这个代码,它创建了一系列三角形.这很好,但我想反过来.相反,边缘向上,向下.我尝试了30分钟让它工作......我只是没有得到线性渐变.这是当前的输出

我希望它是这样的:

这是代码:

  background-image: linear-gradient(45deg, #E4E1D6 25%, transparent 25%,transparent), 
                  linear-gradient(-45deg, #E4E1D6 25%, transparent 25%, transparent), 
                  linear-gradient(45deg, transparent 75%, #E4E1D6 75%),                
                  linear-gradient(-45deg, transparent 75%, #E4E1D6 75%);
  width: 100%;
  background-position: 0px 7px;
  position: relative;
  top: -47px;
  height: 7px;
  background-size: 10px 12px;

感谢帮助.

Answer 1

只需background-position: 0px 7px改为background-position: 0 0

div {
  background: linear-gradient(45deg, #E4E1D6 25%, transparent 25%,transparent), 
                  linear-gradient(-45deg, #E4E1D6 25%, transparent 25%, transparent), 
                  linear-gradient(45deg, transparent 75%, #E4E1D6 75%),                
                  linear-gradient(-45deg, transparent 75%, #E4E1D6 75%);
  width: 100%;
  background-position: 0 0;
  position: relative;
  height: 7px;
  background-size: 10px 12px;
}

<div></div>