是否有必要（或建议）将 CSS 样式添加到 HTML 元素？答案

【问题标题】：Is it necessary (or advisable) to add CSS styling to the HTML element?是否有必要（或建议）将 CSS 样式添加到 HTML 元素？
【发布时间】：2014-05-28 18:13:15
【问题描述】：

在查看其他人的代码（或许多 CSS 重置）时，我看到 html 元素使用基本样式（如 height: 100%）处理，有时我看到它完全被忽略了。在我的实验中没有区别，但我不确定我是否遗漏了什么。

在this post他们给出了

的例子

html,body{
   min-height: 101%;
}

保持滚动条可见（但没有其他明确的答案）。除了像这样的 hack，还有什么特别的理由来设置 html 元素的样式吗？

【问题讨论】：

只是出于好奇，您已经问了 30 个问题，为什么没有将任何好的答案标记为“正确”？这是在 SO 上说“谢谢”的一种方式，也是一种让其他用户立即从一堆其他答案中看到哪些答案对你的任务有帮助的方法。
见Should global css styles be set on the html element or the body element?和What's the difference in applying CSS to html, body, and *?
在html和body上应用样式的一些例子可以在这里找到：Applying a background to <html> and/or <body>和height: 100% or min-height: 100% for html and body elements?

标签： html css

【解决方案1】：

我能想到的主要原因是，为了在% 中指定height，父元素需要明确设置高度。

假设您有一个容器 <div>，您需要为 100% 高度和响应。除非您为其父级 <body> 指定高度，否则仅应用 height:100% 将不起作用。

因此我们将为<body> 应用height:100% - 现在，这将不起作用，因为<body> 的父级没有明确设置高度 - 这是我们的<html> 元素。

因此我们申请

html{
 height:100%;
}

...！

如果您的设计不是响应式的，则不需要这样做，即如果您以像素

为单位设置固定尺寸

【讨论】：

设置html {height: 100%} 是否真的明确设置？（看起来确实如此）基本上您所说的是，如果您使用的是响应式设计，则只需要设置 html 元素的样式？

【解决方案2】：

这用于使 height:100% 相对于视口高度。

【讨论】：

那么这是否意味着，如果您不制作html{height:100%}，html 将不会占用 100% 的视口？
如果你没有把它设置为 100%，那么如果你设置 body 100% 和一个子 div 为 100%，它们就不会是视口的实际高度。
100% 是多少？

【解决方案3】：

据我了解，它是显示滚动条的 html 元素。因此，如果您出于某种原因根本不想显示滚动条，则需要隐藏该元素上的溢出。

更多关于html元素here的信息

【讨论】：

是的，我也读过那篇文章。最佳答案说它只与滚动条有关（所以如果你关心滚动条，那么样式 html，但它也说，(use it) to get 100% height and width 再次，让我觉得如果我确实需要设置 html 元素的样式高度和宽度为视口的 100%
我只能断定html元素很奇怪。对内容很少的页面中的 html 元素应用边框的快速测试表明该元素没有填充视口。但是对元素应用背景颜色会显示整个视口的背景颜色。那么哪个实际上代表了 html 元素的“容器”？将 html 元素的高度设置为 100% 实际上使其高于视口。
是的，我在使用 flexbox 时在 html 上使用/省略 css 样式时看到了一些奇怪的东西。我想从现在开始我总是将高度设置为 100%
戴夫，您观察到的行为在此处描述：stackoverflow.com/questions/10947541/…