Question

当我使用下面的代码时，我在许多教程中以相同的形式看到了这些代码：

body { 
    background-image: -webkit-gradient(linear, 
    0% 0%, 0% 100%, from(#000), to(#fff)); 
}

我得到了这个结果（Safari 5.0.5）：

多次重复8px渐变。

Answer 1

回答我自己的问题：

上面的屏幕截图来自一个绝对没有内容的页面。显然使用Safari，如果它是空的，身体是8px高？渐变也会显示在整个视口上，即使只应用于身体......？

我很想得到解释，但无论如何，解决方法就是：

html, body { height: 100%; }

因为某些原因body { height: 100%; }还不够。

Answer 2

如果您从from()和to()更改为使用颜色停止会怎样？

background-image: -webkit-gradient(
    linear,
    left top,
    left bottom,
    color-stop(0, #000),
    color-stop(1, #FFF)
);

除非您使用-webkit-repeating-linear-gradient，否则不应该重复。

资源