Scalable Vector Graphics/Gradiënten en patronen: verschil tussen versies

geen bewerkingssamenvatting
Geen bewerkingssamenvatting
 
==Lineaire gradiënt==
GradiëntsEen gradiënt is een kleur die overgaat in een andere kleur. Bij een lineaire gradiënt is dit van de ene kant naar een andere kant in een rechte lijn. Dit kan ook uit meer deremeerdere kleuren bestaan. ElkElke kleur wordt bepaald door een stop-tag. De stop-tag heeft natuurlijk hetde kleur (stop-color) nodig en ook waar (offset) de gradiënt deze kleur moet hebben. Een gradiënt dien je, net als een alfbeeldingafbeelding die je wilmeer meerderedan eens malenwilt hergebruikengebruiken, te definiëren in de defs-tag.
 
===Voorbeeld===
====Code====
{{Voorbeeld|1=
<span style='font-family: courier new'>
<defs>
<?xml version="1.0" standalone="no"?><br />
<linearGradient id="RoodGroen">
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><br />
<stop offset="0%" stop-color="red" />
<br />
<stop offset="100%" stop-color="green" />
<svg width="105" height="85" version="1.1" xmlns="http://www.w3.org/2000/svg"><br />
</linearGradient>
&#160;&#160;&#160;&#160;<defs><br />
</svgdefs>
&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;<linearGradient id="RoodGroen"><br />
 
&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;<stop offset="0%" stop-color="red" /><br />
<rect width="105" height="85" fill="url(#RoodGroen)" x="0" y="0" />
&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;<stop offset="100%" stop-color="green" /><br />
}}
&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;</linearGradient><br />
 
&#160;&#160;&#160;&#160;</defs><br />
<br />
&#160;&#160;&#160;&#160;<rect fill="url(#RoodGroen)" x="0" y="0" width="105" height="85" /><br />
</svg>
</span>
====Afbeelding====
[[Afbeelding:Svg-linear_gradient.svg]]
 
{{sub}}
Informatie afkomstig van https://nl.wikibooks.org Wikibooks NL.
Wikibooks NL is onderdeel van de wikimediafoundation.