与正文相比，将css规则应用于html有什么不同？
与正文相比，将css规则应用于html有什么不同？
提问于 2011-07-19 05:20:35
我看不出有什么区别：
html {
background: #f1f1f1;
}和
body {
background: #f1f1f1;
}有什么解释吗？
回答 3
Stack Overflow用户
发布于 2011-07-19 05:23:06
html是body的父对象。一种查看差异的方法是这样做：
html {
overflow: scroll;
}
body {
overflow: scroll;
}您将看到有两组嵌套的滚动条，一组属于html，另一组属于body。
Stack Overflow用户
发布于 2011-07-19 06:16:50
有人在这里写道，总是100%的高度，但这不是真的！
尝试去做(在FF4上测试)：
html{
background:yellow;
}
body{
background:red;
height:100px;
}仅当<body>未设置颜色时，<html>颜色才会影响<html>颜色。这里最烦人的事情是当<body>有颜色而<html>没有的时候，一些浏览器版本会在最后一个带边距的直接子块元素上遇到麻烦。颜色将被剪切后的元素和页边距将是<html>颜色。如果设置了<html>颜色，则始终为真。
另一方面，当设置了<html>背景时，<body>可以具有例如边距。这简直是一团糟。
到目前为止，最佳实践是将背景颜色、字体等应用于两者。简单地说，你每次都要写：
body{}将其更改为：
body,html{}不要在<body>和<html>上使用任何CSS box-model属性(或者让它保持不变，只是为了安心)。创建内部元素(可以是100%的宽度)并使用它。
Stack Overflow用户
发布于 2011-07-19 05:23:11
通常情况下应该没有任何区别，因为这两个元素都应该占据整个屏幕。这就像在其他div中有一个div一样。但是我认为设置body标签的样式更正确，因为html实际上并不是布局的一部分。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/6739601
复制相关文章
相似问题