如何仅使用 CSS 将 Div 元素置于屏幕中央？

将

居中使用 CSS 的屏幕上的元素

问题：

如何将

居中？屏幕上的元素，无论屏幕大小如何，仅使用 CSS？

解决方案：

将

居中（或）元素位于屏幕中央，请按照以下步骤操作：

1. 将元素的位置设置为“绝对”。
2. 设置顶部和左侧属性设置为“50%”。
3. 使用负边距来偏移元素的位置，使其出现居中：
   

   <br> 顶部边距：-{元素高度}/2；<br> 左边距：-{元素宽度}/2;<br>

   登录后复制

固定示例大小：

#myDiv {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -50px;
  margin-left: -50px;
  width: 100px;
  height: 100px;
}

登录后复制

注意：

• 如果您不希望元素随网站滚动，请考虑使用“固定”定位而不是“绝对”。
• 对于调整其大小的动态元素，请使用 JavaScript 或 CSS calc() 来计算正确的边距。

以上是如何仅使用 CSS 将 Div 元素置于屏幕中央？的详细内容。更多信息请关注PHP中文网其他相关文章！