如何仅用CSS调整表格/td内文本位置？适配WordPress古腾堡

表格单元格<td>属于表格布局元素，margin属性在这类元素上默认不生效——表格有自身的布局规则，所以你之前用margin-top/-left的方法不会起作用。结合古腾堡生成的表格结构，可通过以下几种CSS方案实现文本位置调整：

方法1：相对定位微调文本位置 #

通过position: relative让文本相对于单元格原位置偏移，适合精准调整垂直/水平位置：

.wp-block-table table tbody tr:first-child td {
  position: relative;
  top: -20px; /* 垂直向上偏移20px，可按需修改数值 */
  left: -20px; /* 水平向左偏移20px，可按需修改数值 */
}

注意：相对定位仅移动文本显示位置，不会改变单元格的实际尺寸，不会破坏表格整体布局。

方法2：调整内边距+行高（适合垂直对齐调整） #

如果只是需要让首行文本靠上显示，通过修改单元格内边距和行高更符合表格布局逻辑：

.wp-block-table table tbody tr:first-child td {
  padding-top: 0; /* 移除单元格上内边距 */
  line-height: 1.2; /* 缩小行高让文本更紧凑，数值按需调整 */
}

这种方法不会偏移文本，而是通过压缩单元格内部空间实现文本位置上移，兼容性更好。

方法3：文本缩进（仅水平位置调整） #

如果只需要调整水平方向位置，使用text-indent更高效：

.wp-block-table table tbody tr:first-child td {
  text-indent: -20px; /* 文本向左缩进20px，负数为向左，正数向右 */
}

进阶：针对特定表格生效 #

如果不需要所有古腾堡表格都应用该样式，可以在古腾堡编辑器中给目标表格块添加自定义类名（比如custom-header-table），然后修改CSS选择器：

.wp-block-table.custom-header-table table tbody tr:first-child td {
  /* 这里写上述任意一种样式 */
}

内容的提问来源于stack exchange，提问作者meniK