CSS3渐变重复

Question

我正在尝试实现一个对角线CSS3渐变,从左上角的黑色到右下角的深灰色.

就像是:

body {
     background: -webkit-linear-gradient(left top, black, darkgray 80%, gray);
}

它不是按照我的意图显示,而是在页面的每一对水平线上反复重复.我究竟做错了什么？

Answer 1

身体没有高度; 你只看到8px顶部/底部边缘的背景(总是透明的).

如果你希望你的渐变填充视口,设置的100%的高度上既 <html>&<body>

html, body {
    height: 100%;
}

body {
    background: linear-gradient(orange, red, yellow);
    margin: 0;
}