margin: auto垂直水平居中怎么实现

使用 `margin: auto;` 实现垂直和水平居中通常是在块级元素且宽度已知的情况下。当一个元素没有特定宽度（比如自适应或者 `width: 100%;`），并且其父元素的宽度是固定的，你可以这样做：

.parent {
  position: relative;
  display: flex; /* 或者 inline-flex */
  justify-content: center; /* 水平居中 */
  align-items: center; /* 垂直居中 */
}

.child {
  position: absolute; /* 这里是为了避免影响行内布局 */
  margin: auto;
}

在这个例子中，`.parent` 使用了 Flexbox 布局，`justify-content: center;` 和 `align-items: center;` 可以让 `.child` 在其内部居中。由于`.child` 的 `position: absolute;`，它不会影响到父元素的实际文本行高或浮动元素，只是简单地在父元素中心位置显示。

如果父元素是表格单元格（td或th），则可以直接使用 `vertical-align: middle;` 和 `text-align: center;`。

注意，这种方法在某些老版本浏览器或不支持Flexbox的场景下可能无法工作，所以最好在实际项目中检查兼容性。