css - CSS3渐变重复

Question

我正在尝试实现从左上角的黑色到右下角的深灰色的对角 CSS3 渐变。

就像是：

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

它并没有按照我的意图显示，它只是在页面上的每几行水平重复一遍。我究竟做错了什么？

score 6 · Accepted Answer

身体没有高度；您只能看到顶部/底部边距的 8px 的背景（始终是透明的）。

如果您希望渐变填充视口，请将&的高度设置为 100% <html><body>

html, body {
    height: 100%;
}

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

1 回答 1