CSS3的背景大小似乎不工作

Question

我努力让CSS3渐变的大小正常工作。我已经设置了一个background-size:800px;，正如在下面的jsfiddle中看到的，它肯定不是800px。我误解了财产吗？它在不同的情况下似乎有所不同。当没有使用其他头文件时，后台会使用浏览器调整大小，如果包含在H5BP中，它不会调整大小，但高度太短。

我非常非常困惑！我如何创建一个特定大小的重复背景渐变？

body { 
    background: #0d1a2d; 
    background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #1b355a), color-stop(50%, #000000), color-stop(100%, #1b355a)); 
    background-image: -webkit-linear-gradient(#1b355a, #000000 50%, #1b355a); 
    background-image: -moz-linear-gradient(#1b355a, #000000 50%, #1b355a); 
    background-image: -o-linear-gradient(#1b355a, #000000 50%, #1b355a); 
    background-image: linear-gradient(#1b355a, #000000 50%, #1b355a); 
    background-size: 800px; 
} 

的jsfiddle：background-size example

Answer 1

您需要在X和Y方向上以指定的大小，就像这样：

background-size: 800px 800px; 

View on JSFiddle

虽这么说，你”已完成的是符合with the CSS3 specs。然而，根据to the MDN--以及我们可以从您的实验中收集的信息 - 浏览器符合此规范是不一致和不可靠的。所以，现在，最好明确定义两个方向。

一旦浏览器的行为符合规格，设置单个值将会将另一个设置为auto。哈哈！