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>

Screenshot	Live sample

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)

Desktop
Mobile

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)。

linearGradient

用法

示例

属性

Global 属性

专有属性

DOM 接口

浏览器兼容性

参见