Question

我在谷歌浏览器的这个页面上看到了双重背景渐变......任何想法为什么？

http://www.starcraft-source.com/member/login/

我需要它是纯蓝色

Answer 1

您的意思是显示在页脚下方的其他背景渐变？

html {
background:-moz-linear-gradient(center bottom , #1A405D 70%, #0A1C2D 92%) repeat scroll 0 0 transparent;
}

需要

html {
background:-moz-linear-gradient(center bottom , #1A405D 70%, #0A1C2D 92%) no-repeat scroll 0 0 transparent;
}

你不应该重复这种渐变背景。

当然，现在你需要处理页脚下方的空格，但这是一个不同的问题。

Answer 2

就个人而言，我会避免使用html元素的样式。您可以在背景图像上使用渐变，以释放背景颜色。我会使用以下内容：

body{
background: #1A405D;
background-image: -webkit-linear-gradient(#0A1C2D,#1A405D);
background-image:-moz-linear-gradient(center bottom , #1A405D 70%, #0A1C2D 92%);  
background-repeat:no-repeat;
}

这会给你一个如下结果： http://jsfiddle.net/Sapphion/QJwA6/

Answer 3

您已将渐变放在html元素上（BTW在技术上没有错，但不常见），但html未填充整个视口。

尝试添加

html {
  height: 100%;
}

背景渐变问题

3 个答案: