linearGradient

linearGradient元素用来定义线性渐变，用于图形元素的填充或描边。

用法

类别渐变元素
允许的内容物任意数量、任意排序的下列元素：
描述性元素
<animate>, <animateTransform>, <set>, <stop>

示例

<svg width="120" height="120"  viewBox="0 0 120 120"
     xmlns="http://www.w3.org/2000/svg" version="1.1"
     xmlns:xlink="http://www.w3.org/1999/xlink" >

    <defs>
        <linearGradient id="MyGradient">
            <stop offset="5%"  stop-color="green"/>
            <stop offset="95%" stop-color="gold"/>
        </linearGradient>
    </defs>

    <rect fill="url(#MyGradient)"
          x="10" y="10" width="100" height="100"/>
</svg>

ScreenshotLive sample

属性

Global 属性

专有属性

DOM 接口

该元素实现了SVGLinearGradientElement接口。

浏览器兼容性

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help! (en-US)

Feature Chrome Firefox (Gecko) IE Opera Safari
Basic support 1.0 1.5 (1.8) 9.0 9.0 3.0.4
Feature Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Basic support 3.0 1.0 (1.8) 未实现 (Yes) 3.0.4

该表格基于这些资源。

 

[1] WebKit不支持spread方法 (bug 5968) 以及颜色插值 (bug 6034)。

参见