html - 如何创建适用于大多数/所有浏览器的渐变背景？

Question

这是我想做的，不知何故:

1- 从上到下的渐变背景。应该有 2 种颜色，我们称它们为 color1 和 color2。

2- 我希望渐变大约是一页，所以它从顶部的颜色 1 开始，然后到下一页的颜色 2 结束。

3- 然后，无论页面大小如何，我都希望 color2 一直向下显示。

这可能用 css 实现吗？

谢谢

Answer 1

您可以创建几个像素宽的图像，以及您想要的“页面大小”的任何垂直长度。

在 CSS 中，有一种方法可以控制 repeating of an image .所以，你可以做一个 repeat-x，让图像从左到右重复。然后，只需将您网站的背景颜色设置为第二种颜色即可，这样如果您的内容进一步扩展，用户将只会看到 Color2。

例如CSS

body {
    background-color: #b5b5b5; /*gray*/
    background-image: url(./images/body_bg_gray_1380px.gif); /*path to wherever your bg img is...*/
    background-repeat: repeat-x;
}