alignment-baseline - SVG 编辑

« SVG属性参考主页

alignment-baseline属性指定了一个对象如何相对于它的父元素对齐。这个属性指定了该元素的基线对齐到相应的父元素的基线。举个例子，允许罗马文字中的字母表基线在字体大小发生变化时保持一致。它的默认值是baseline，与该alignment-baseline属性的计算值同名。

作为一个外观属性，它还可以直接作为CSS样式表内部的属性使用。请阅读css alignment-baseline以了解更多信息。

用法

示例

<?xml version="1.0"?>
<svg width="300" height="120" viewBox="0 0 300 120"
     xmlns="http://www.w3.org/2000/svg" version="1.1">

    <!-- Materialisation 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>

    <!-- Materialisation 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>

元素

下列元素使用alignment-baseline属性：

• <tspan>
• <tref>
• <altGlyph>
• <textPath>

如果对象要在别的元素中对齐（比如在<text>元素中），请阅读dominant-baseline。

参见

• css alignment-baseline