我试图将页脚定位在页面底部或屏幕底部，以较低者为准。我认为以下方法会起作用：
body { margin-bottom: 4em; }
.footer { position:absolute; bottom: 0 }
但是，即使页面长于屏幕，以上内容也始终将.footer放在屏幕底部。我费了好几个小时才发现需要以下物品：
html { position: relative }
应用于position元素时，找不到html样式的文档。 html元素的样式是什么？ Html是所有元素之父，那么position是什么意思？元素position的{{1}}的默认值是什么？
答案 0 :(得分：1)
CSS 位置用于为任何HTML元素提供自定义位置。 位置样式具有4种不同的值类型，它们是静态|相对|绝对|固定。让我们看一下每个值，所以让我们从 static 位置值开始，每个元素在网页中都有默认位置，因此为元素提供静态位置意味着它将保持该元素为默认值位置，并且将元素的位置指定为静态是没有用的。接下来是相对，如果您将元素的位置设置为相对位置，则此值对其位置没有影响，但是您可以使用顶部，底部，左侧，右侧属性将元素从其正常位置移开，而不会对网页中的其他元素位置产生任何影响或对其产生任何影响。现在让我们查看绝对位置值，因此，当给元素赋予绝对位置时，该元素会从其正常位置中断其正常流动，并根据父级获得位置元素或通过浏览器窗口。它将从该父元素获取位置，该父元素的位置值已经被给出为 relative | absolute | fixed ，除了 static 。现在，最后一个职位类型是固定，因此，如果您将元素的位置设为固定，则可以移动该元素 元素移动到任何 x和y位置，该元素将固定为给定的 x和y位置，并且在向上或向下滚动时甚至不会从该固定位置移动在该网页中。
答案 1 :(得分：0)
元素的默认位置是静态的，因此我们根据需要通过提供不同的位置来调整该静态位置。这里是不同的链接：
https://css-tricks.com/absolute-relative-fixed-positioining-how-do-they-differ/
页脚链接始终位于底部：为此，您将html和body的高度设置为100％，然后将body的最小高度设置为100％
https://matthewjamestaylor.com/blog/keeping-footers-at-the-bottom-of-the-page
答案 2 :(得分：0)
position: relative（没有附带的偏移量）几乎专门用于创建position: absolute的引用（追溯到找到的第一个非静态元素）。
默认值为static（每MDN），尽管添加relative不会在视觉上改变任何东西，除非您添加偏移量。
答案 3 :(得分：0)
<html>确实具有一些特殊的属性，但是在样式方面，您可以将其视为其他任何块元素（例如<div>）。
我假设您已经了解每个position值对元素的作用。对于absolute，元素相对于其最接近的祖先进行定位。如果没有，则相对于initial containing block放置，即：
根元素（）所在的包含块是一个称为初始包含块的矩形。它具有视口（用于连续介质）或页面区域（用于分页介质）的尺寸。
因此，如果元素是绝对定位的，并且没有相对定位的父元素，则将其定位为相对于视口而言。因此，您的原始观察结果。
向position: relative元素添加<html>的工作原理与在其他任何元素上工作的原因相同。
请注意，如果页面较短，则将position: relative元素添加到<html>元素可能会导致页脚上升到视口的中间，因为<html>的高度由内容的高度决定。通过将html的min-height设置为100%，可以很容易地解决此问题。