h5div咱、在屏幕居中

在HTML5中，如果你想让一个`<div>`元素在屏幕上水平和垂直都居中，可以采用以下几种方法：

1. **Flexbox**（现代浏览器推荐）：将包含`<div>`的父元素设置为`display: flex; justify-content: center; align-items: center;`，然后给`<div>`设置`flex: 1;`使其占据剩余空间。

<div class="parent">
  <div class="centered">Your content here</div>
</div>

<style>
.parent {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100vh; /* 视口高度 */
}

.centered {
  flex: 1;
}
</style>

2. **CSS Grid**：类似Flexbox，将父元素设为`display: grid; place-items: center;`。

<div class="parent">
  <div class="centered">Your content here</div>
</div>

<style>
.parent {
  display: grid;
  place-items: center;
  height: 100vh;
}

.centered {
  /* 如果需要网格单元格尺寸，添加相应的样式 */
}
</style>

3. **Positioning + Transforms**: 对`<div>`应用`position: absolute;`，并使用`transform: translate(-50%, -50%)`。

<div class="parent" style="position: relative; width: 100%; height: 100vh;">
  <div class="centered" style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);">...</div>
</div>

请注意，为了确保在旧版浏览器中也能正常工作，可能需要加上一些浏览器前缀。同时，确保你的`<div>`有固定的高度或宽度，否则它们可能不会像预期那样居中。