To show you how easy it is to create and use svg elements, here is a simple example.
<svg xmlns=”http://www.w3.org/2000/svg” width=”500px” height=”300px” viewBox=”0 0 1500 300″>
<text x=”250″ y=”150″
font-family=”Verdana”
font-size=”250pt”>
Hello
</text>
</svg>
You can also just use the text element by itself. This is a text element, selectable, and easy to format.
To rotate the text (say) just add a transform attribute within the text element …..
<text x=”10″ y=”20″
transform=”rotate(30 20,40)”>
SVG Text Rotation example
</text>
And to style the element, just add a style attribute…..
<svg xmlns=”http://www.w3.org/2000/svg” width=”100px” height=”50px”>
<text x=”10″ y=”20″
style=”font-family: Times New Roman;
font-size : 24;
stroke : #00ff00;
fill : #0000ff;”>
Hello
</text>
</svg>
Nice and easy!
