使文字在图片中垂直居中和水平居中

在网页设计或者图形编辑中，要让文字在图片中垂直和水平居中，通常有几种常见的方法：

1. **CSS** (层叠样式表) 居中：
- 使用 `position: absolute;` 和 `top: 50%; left: 50%;` 将元素定位为其父容器的中心，然后通过负值调整偏移量实现居中。例如：

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

或者直接使用 `display: flex; justify-content: center; align-items: center;` 对包含图片和文字的容器进行居中。

2. **HTML `<img>` 标签** 配合 CSS 的 `text-align` 和 `vertical-align` 属性：
- 给图片设置 `display: inline-block;` 或 `float: none; display: table-cell; vertical-align: middle;` 来使其成为内联块级元素，并且文本垂直居中。

3. **使用 CSS Grid 或 Flexbox**:
- 如果是更复杂的布局，可以利用 CSS Grid 的 `align-items: center; justify-items: center;` 或 Flexbox 的类似属性来同时处理水平和垂直居中。

记得根据实际需求选择合适的方法，有时候也需要考虑响应式设计，保证在不同屏幕尺寸下也能保持良好的对齐效果。