html - CSS3 背景 : repeating-linear-gradient

Question

几天前我读了这篇文章:http://tutorialzine.com/2013/10/12-awesome-css3-features-you-can-finally-use/

并找到了新的 CSS3 语法 repeating-linear-gradient .

到目前为止它只适用于 FireFox，即使我使用了前缀。

background: #000;
background-image: -webkit-repeating-linear-gradient(-45deg, black, black, #2a2a2a 6px, #2a2a2a 6px);
background-image: -moz-repeating-linear-gradient(-45deg, black, black, #2a2a2a 6px, #2a2a2a 6px);
background-image: -ms-repeating-linear-gradient(-45deg, black, black, #2a2a2a 6px, #2a2a2a 6px);
background-image: -o-repeating-linear-gradient(-45deg, black, black, #2a2a2a 6px, #2a2a2a 6px);
background-image: repeating-linear-gradient(-45deg, black, black, #2a2a2a 6px, #2a2a2a 6px);

我有最新版本的谷歌浏览器(版本 30.0.1599.101 m)和 IE(v9.0.8112.16421)。由于某些公司政策，我无法将 IE 更新到更高版本。

我做错了什么吗？

This is my fiddle

Answer 1

您的示例在 Firefox (20.0) 和 Chromium (25.0.1364.160) 中确实有效。我改编了 MDN - repeating-linear-gradient 中的示例.我只加了一个宽高

#grad3 {
    width: 100px;
    height: 100px;
}

参见 JSFiddle

当你改变其中一种黑色时，你会更好地看到图案，参见修改后的JSFiddle .