div文本框上下左右居中

在HTML中，如果你想让一个`<div>`元素的内容在水平和垂直方向上都居中对齐，可以采用多种方法。这里有几个常见的CSS样式实现：

1. **Flexbox布局**:
如果你的浏览器支持Flexbox，可以使用`.align-items` 和 `.justify-content` 属性实现：

   .container {
     display: flex;
     justify-content: center; /* 水平居中 */
     align-items: center; /* 垂直居中 */
   }
   
   .text-box {
     /* 其他样式 */
   }

2. **Grid布局** (如果也支持):
Grid布局下，可以类似地设置`place-items`属性：

   .container {
     display: grid;
     place-items: center; /* 同时居中 */
   }
   
   .text-box {
     /* 其他样式 */
   }

3. **内联样式** (适用于简单需求)：
直接在`<div>`标签内设置：

   <div class="center-text" style="margin: auto; display: table-cell; vertical-align: middle;">
     <!-- 文本内容 -->
   </div>

这里假设`.center-text`的宽度已经被限制了。

4. **绝对定位**:

   .container {
     position: relative;
   }
   .text-box {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
   }

这种方法适合于容器大小已知的情况。