div内文字上下左右居中

在HTML中，如果你想让`<div>`元素内的文本在水平和垂直方向上都居中对齐，可以采用以下几种方法：

1. **CSS Flexbox**:
如果你的浏览器支持Flexbox，你可以这么设置：

   <style>
       .centered-div {
           display: flex;
           justify-content: center; /* 水平居中 */
           align-items: center; /* 垂直居中 */
       }
   </style>

   <div class="centered-div">
       这里是居中的文本
   </div>

2. **CSS Grid**:
同样，如果使用Grid布局，也相当简单：

   <style>
       .centered-div {
           display: grid;
           place-items: center; /* 相当于同时设置justify-content和align-items为center */
       }
   </style>

   <div class="centered-div">
       这里是居中的文本
   </div>

3. **绝对定位** (兼容老式浏览器):
如果不依赖现代布局技术，可以使用绝对定位配合父容器的相对定位：

   <style>
       .parent {
           position: relative;
       }
       .child {
           position: absolute;
           top: 50%;
           left: 50%;
           transform: translate(-50%, -50%);
       }
   </style>

   <div class="parent">
       <div class="child">
           这里是居中的文本
       </div>
   </div>

记得检查浏览器的兼容性，有些古老的浏览器可能不支持新的布局属性。