alignment-baseline

auto 已弃用

该值为字符所属脚本的主基线，即使用父元素的主基线。

基线

使用父元素的主基线选择。将框的相应基线与其父元素的基线匹配。

before-edge 已弃用

要对齐的对象的对齐点与父文本内容元素的“before-edge”基线对齐。

文本底部

将框的底部与父元素内容区域的顶部匹配。

文本前边缘

要对齐的对象的对齐点与父文本内容元素的“text-before-edge”基线对齐。

注意：此关键字可能映射到text-top。

中间

将框的垂直中点与父框的基线加上父框的 x 高度的一半对齐。

中心

将框的中心基线与其父元素的中心基线匹配。

after-edge 已弃用

要对齐的对象的对齐点与父文本内容元素的“after-edge”基线对齐。

文本顶部

将框的顶部与父元素内容区域的顶部匹配。

文本后边缘

要对齐的对象的对齐点与父文本内容元素的“text-after-edge”基线对齐。

注意：此关键字可能映射到text-bottom。

表意文字

将框的表意文字字符面下侧基线与其父元素的基线匹配。

字母

将框的字母基线与其父元素的基线匹配。

悬挂

要对齐的对象的对齐点与父文本内容元素的“hanging”基线对齐。

数学

将框的数学基线与其父元素的基线匹配。

顶部

将对齐子树的顶部与行框的顶部对齐。

中心

将对齐子树的中心与行框的中心对齐。

底部

将对齐子树的底部与行框的底部对齐。

SVG 2 对此属性的定义进行了一些更改。特别是：已删除值auto、before-edge和after-edge。为了向后兼容，text-before-edge可能映射到text-top，而text-after-edge映射到text-bottom。text-before-edge和text-after-edge都不应与vertical-align属性一起使用。

<svg
  width="300"
  height="120"
  viewBox="0 0 300 120"
  xmlns="http://www.w3.org/2000/svg">
  <!-- Materialization of anchors -->
  <path
    d="M60,10 L60,110
              M30,10 L300,10
              M30,65 L300,65
              M30,110 L300,110
              "
    stroke="grey" />

  <!-- Anchors in action -->
  <text alignment-baseline="hanging" x="60" y="10">A hanging</text>

  <text alignment-baseline="middle" x="60" y="65">A middle</text>

  <text alignment-baseline="baseline" x="60" y="110">A baseline</text>

  <!-- Materialization of anchors -->
  <circle cx="60" cy="10" r="3" fill="red" />
  <circle cx="60" cy="65" r="3" fill="red" />
  <circle cx="60" cy="110" r="3" fill="red" />

  <style>
    <![CDATA[
      text{
        font: bold 36px Verdana, Helvetica, Arial, sans-serif;
      }
    ]]>
  </style>
</svg>

对于其他元素（例如<text>）中的对象对齐，请参阅dominant-baseline。

• CSS 基线对齐