在“浏览器”窗口中将Div垂直对齐（-不在其他元素内）

Question

我有一个div，我想一直垂直对齐浏览器窗口高度的50％。

我不知道浏览器窗口的高度在任何时候都应该是什么，用户是否应该缩放该窗口。 如果将它放置在另一个元素中是必要的，那很好，但是正如刚刚指定的那样，我不知道任何时候视口有多高。

我也不会使用javascript。

我已经阅读了该站点，我一直在寻找解决方案，但是我真的想（再次）将其扔在那里，因为我还没有找到可以完全做到这一点的解决方案，无论是通过钩子还是通过弯曲。

谢谢。

Answer 1

您没有指定高度是否固定？ 如果是这样，那么您可以使用一个元素执行此操作，只需添加以下示例CSS：

.centered {
  height: 100px;
  width: 100%;
  background: red;
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -50px; /* half the height of the element */
}

您可以使用多种技术，具体取决于您要如何实现它。 一些（旧的），但仍然相关阅读这里 。