我怎样才能用css和html做这种类型的之字形

Question

当我尝试获得这种类型的锯齿形时，我遇到了问题，我尝试了很多，但不幸的是它不起作用。

我尝试了这种编码方式

CSS

.zigzag:before {
  content: "";
  display: block;
  position: absolute;
  top: -10px;
  width: 100%;
  height: 10px;
}
.container2:before {
  background:
    linear-gradient(
      45deg, transparent 33.333%,
      #E2E2E2 33.333%, #E2E2E2 66.667%,
      transparent 66.667%
    ),
    linear-gradient(
      -45deg, transparent 33.333%,
      #E2E2E2 33.333%, #E2E2E2 66.667%,
      transparent 66.667%
    );
  background-size: 20px 40px;
}

但我喜欢锯齿形矩形，但我需要的是直线而不是矩形

我想要这样

Answer 1

div{
    height: 50px;
    background:  
      linear-gradient(135deg, white 35%, transparent 25%) -25px 0,
      linear-gradient(225deg, white 35%, transparent 25%) -25px 0,
      linear-gradient(315deg, white 35%, transparent 25%),
      linear-gradient(45deg, white 35%, transparent 25%);   
    background-size: 50px 50px;
    background-color: black;
}

http://jsfiddle.net/4ay1uduz/

只需将其全部更改50px为元素的高度，然后将其全部更改25px为其高度的一半。