linearGradient

Esta tradução está incompleta. Ajude atraduzir este artigo.

O elemento linearGradient permite que os autores definam gradientes lineares para preenchimento (fill) ou contornos (stroke) de elementos gráficos.

Usage context

CategoriasElemento gradiente
Conteúdo permitidoQualquer número dos seguintes elementos, em qualquer ordem:
Elementos descritivos
<animate>, <animateTransform>, <set>, <stop>

Example

Código fonte Resultado final
<?xml version="1.0"?>
<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>

» linearGradient.svg

Atributos

Atributos globais

Atributos específicos

Interface DOM

Este elemento implementa a interface SVGLinearGradientElement.

Compatibilidade dos navegadores

Recurso Chrome Firefox (Gecko) IE Opera Safari
Suporte básico 1.0 1.5 (1.8) 9.0 9.0 3.0.4
Recurso Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Suporte básico 3.0 1.0 (1.8) Não suportado (Yes) 3.0.4

Esta tabela é baseada nestas fontes.

Notas específicas para WebKit

Navegadores baseados no Webkit não suportam spreadMethod (bug 5968) e interpolação de cores (bug 6034).

Veja também

Etiquetas do documento e colaboradores

Etiquetas: 
 Colaboradores desta página: Sebastianz, caio, eltonmesquita
 Última atualização por: Sebastianz,