css怎么把图片和字段居中

在CSS中将图片和文本内容居中对齐，可以使用多种方法，取决于具体的布局需求。以下是常见的几种方法：

1. **块级元素居中**:
如果你是想让一个`<img>`标签和一些文字并排居中在行内，可以使用`display: flex; justify-content: center; align-items: center;`。如果是块级元素，如`<div>`, 可以直接设置`text-align: center;` 对其内的文字居中，对于图片，可以用`margin: auto;`使其左右自动对齐。

.container {
  display: flex;
  justify-content: center;
  align-items: center;
}

img {
  margin: auto;
}

2. **绝对定位**:
另一种方式是给容器设置`position: relative;`，然后给元素设置`position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);`使其垂直和水平居中。

.container {
  position: relative;
}

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

img {
  /* 如果图片是绝对定位，需要添加宽高 */
  width: 100px; height: 100px;
}

3. **表格单元格居中**:
如果是在表格中，可以利用`table-cell`伪类和`vertical-align: middle;` 属性。

td {
  vertical-align: middle;
}