paint-order
paint-order
该paint-order
属性指定给定形状或文本元素的填充,描边和标记被绘制的顺序。它的默认值是normal
,这表示先填充,然后是笔画,最后是标记。
作为一个表现属性,它也可以直接在CSS样式表中作为属性使用。
用法说明
分类 | 呈现属性 |
---|---|
值 | 正常| fill || 笔画|| 标记| 继承 |
动画 | 是 |
规范性文件 | SVG 2 |
例子
<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 »
浏览器兼容性
Feature | Firefox (Gecko) | Chrome | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Basic support | (Yes) | (Yes) | No support | (Yes) | (Yes) |
Feature | Firefox Mobile (Gecko) | Android | IE Phone | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
Basic support | ? | No support | No support | No support | No support |