使用clip-path属性修改块元素？

Question

我正在尝试使用clip-path创建自定义形状的div：

＆＃13;

＆＃13;

#chevron {
  width: 100%;
  height: 200px;
  background-image: url("http://imgur.com/2IZCVpi.jpg");
  background-size: cover;
  background-repeat: no-repeat;
  clip-path: polygon(100% 0, 100% 40%, 50% 52%, 0 38%, 0 0, 50% 8%);
}

＆＃13;

<div id="chevron"></div>

＆＃13;

＆＃13;

＆＃13;

Chrome中的一切都很好，但IE和Firefox不支持剪辑路径。我也试过SVG，但支持也不好。也许我可以用div元素之前和之后的两个图像（箭头形状和主背景颜色）来解决它？你会如何解决它？