lineargradient

<lineargradient>

<linearGradient>SVG元素允许作者定义线性梯度，以填充或中风图形元素。

用法上下文

分类	渐变元素
允许的内容	以任意顺序包含任意数量的以下元素：描述性元素<animate>，<animateTransform>，<set>，<stop>

属性

全局属性

Core attributes

Presentation attributes

Xlink attributes

class

style

externalResourcesRequired

具体属性

gradientUnits

gradientTransform

x1

y1

x2

y2

spreadMethod

xlink:href

DOM接口

这个元素实现了SVGLinearGradientElement接口。

例子

<svg width="120" height="120" xmlns="http://www.w3.org/2000/svg">
    <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

产品规格

Specification	Status	Comment
Scalable Vector Graphics (SVG) 2The definition of '<linearGradient>' in that specification.	Candidate Recommendation
Scalable Vector Graphics (SVG) 1.1 (Second Edition)The definition of '<linearGradient>' in that specification.	Recommendation	Initial definition

浏览器兼容性

Feature	Chrome	Edge	Firefox (Gecko)	IE	Opera	Safari
Basic support	1.0	(Yes)	1.5 (1.8)	9.0	9.0	3.0.41

Feature	Android	Edge	Firefox Mobile (Gecko)	IE Mobile	Opera Mobile	Safari Mobile
Basic support	3.0	(Yes)	1.0 (1.8)	No support	(Yes)	3.0.41