paint-order

该paint-order属性指定给定形状或文本元素的填充，描边和标记被绘制的顺序。它的默认值是normal，这表示先填充，然后是笔画，最后是标记。

要指定不同的顺序，可以使用以空格分隔的关键字fill，stroke和markers的列表。如果三个绘画组件中的任何一个被省略，那么将在指定的组件之后以默认顺序绘制它们。例如，使用stroke相当于笔画填充标记。

作为一个表现属性，它也可以直接在CSS样式表中作为属性使用。

用法说明

例子

<svg xmlns="http://www.w3.org/2000/svg" width="400" height="200">
  <linearGradient id="g" x1="0" y1="0" x2="0" y2="1">
    <stop stop-color="#888"/>
    <stop stop-color="#ccc" offset="1"/>
  </linearGradient>
  <rect width="400" height="200" fill="url(#g)"/>
  <g fill="crimson" stroke="white" stroke-width="6" stroke-linejoin="round"
     text-anchor="middle" font-family="sans-serif" font-size="50px" font-weight="bold">
    <text x="200" y="75">stroke over</text>
    <text x="200" y="150" paint-order="stroke">stroke under</text>
  </g>
</svg>

这个例子将呈现如下：

​

​

元素

以下元素可以使用该paint-order属性：

• Shape elements »

• Text content elements »

浏览器兼容性