背景颜色和谷歌浏览器问题

Question

有时我会在Chrome中破坏背景.我没有得到任何其他浏览器的此错误.

这是负责身体背景颜色的简单CSS线:

body 
{
   background: black;
   color: white;
   font-family: Chaparral Pro, lucida grande, verdana, sans-serif;
}

这正是我遇到这个问题的原因.我点击了Gmail电子邮件中包含的链接,但我得到了错误(没有背景信息).然后我刷新页面,背景完全着色.

怎么解决这个问题？

Answer 1

从来没有听说过.尝试:

html, body {
  width: 100%;
  height: 100%;
  background-color: #000;
  color: #fff;
  font-family: ...;
}

Answer 2

好的,我找到了解决方案.这不是很好,但没有副作用的伎俩.

HTML:

<span id="chromeFix"></span> 

(把它放在身体标签下面)

CSS:

#chromeFix { display: block; position: absolute; width: 1px; height: 100%; top: 0px; left: 0px; }

这有什么办法来解决这个问题:

它迫使Chrome认为页面的内容是100%而不是 - 这会阻止身体"出现"内容的大小并解决丢失的背景错误.这基本上是height: 100%在应用于body或html时执行的操作,但是在滚动(超过100%页面高度)时不会产生背景被切断的副作用,就像在这些元素上使用100%高度一样.

我现在可以睡觉=]

Answer 3

我有同样的问题上一对夫妇的网站,并通过移动从身体的背景造型为HTML固定它(我猜是的变化body {},以html, body{}技术已经被提及,但显示了您只能做与风格上的HTML)例如

body {
   background-color:#000000;
   background-image:url('images/bg.png');
   background-repeat:repeat-x;
   font-family:Arial,Helvetica,sans-serif;
   font-size:85%;
   color:#cccccc;

}

变

html {
   background-color:#000000;
   background-image:url('images/bg.png');
   background-repeat:repeat-x;
}
body {
   font-family:Arial,Helvetica,sans-serif;
   font-size:85%;
   color:#cccccc;
}

这适用于IE6-8,Chrome 4-5,Safari 4,Opera 10和Firefox 3.x,没有明显令人讨厌的副作用.

Answer 4

我能够解决这个问题:

html { height: 100%; }

Answer 5

HTML和正文高度100%在旧的IE版本中不起作用.

您必须将backgroundproperties从body元素移动到html元素.
这将修复它的crossbrowser.