Question

我为学校网站写了以下html：

html {
   background-color: red;
   background-image: linear-gradient(red, Gray);
   background: red;
   background: linear-gradient(red, Gray);
   font-family: Arial, Verdana, sans-serif;
}

它有效，但有一个问题：当我必须绘制整页渐变时，它会向下重复。我不希望它重复。我怎样才能解决这个问题？我搜索了互联网和我的CSS + HTML书籍（预览了HTML5）。

更新：当我在俱乐部页面上工作时（如下所示），渐变已满，并且没有重复。我在桌子上使用了<hr>，它似乎有效。

Answer 1

<html>与默认需要一样高，就像任何其他元素一样。明确地设置它的高度，你应该好好去：

html {
    background-color: red;
    background-image: linear-gradient(red, gray);
    height: 100%;
    font-family: Arial, Verdana, sans-serif;
}

线性渐变重复

1 个答案: