Da revisionare: problemi con Firefox, apri il collegamento con Safari o Chrome
Un testo in una certa posizione (x,y)
1 |
<text x="..." y="...">...</text> |
Il testo “Prova SVG!” di colore blue, dimensione 25, alla posizione (50,50)
1 |
<text x = "50" y = "50" style="fill:blue; font-size:25">Prova SVG!</text> |
… con bordo nero
1 |
<text x = "50" y = "50" style="stroke:black; fill:blue; font-size:25">Prova SVG!</text> |
… in grassetto
1 |
<text x = "50" y = "50" style="fill:blue; font-size:25; font-weight:bolder">Prova SVG!</text> |
… in corsivo
1 |
<text x = "50" y = "50" style="fill:blue; font-size:25; font-style:italic">Prova SVG!</text> |
… sottolineato
1 |
<text x = "50" y = "50" style="fill:blue; font-size:25; text-decoration:underline">Prova SVG!</text> |
… sbarrato
1 |
<text x = "50" y = "50" style="fill:blue; font-size:25; text-decoration:line-through">Prova SVG!</text> |
… con font della famiglia cursive
1 |
<text x = "50" y = "50" style="fill:blue; font-size:25; font-family:cursive">Prova SVG!</text> |
… sans serif
1 |
<text x = "50" y = "50" style="fill:blue; font-size:25; font-family:sans-serif">Prova SVG!</text> |
… monospace
1 |
<text x = "50" y = "50" style="fill:blue; font-size:25; font-family:monospace">Prova SVG!</text> |
… con spaziatura tra le parole 20
1 |
<text x = "50" y = "50" style="fill:blue; font-size:25; word-spacing:20">Prova SVG!</text> |
… con spaziatura tra le lettere 20
1 |
<text x = "50" y = "50" style="fill:blue; font-size:25; letter-spacing:20">Prova SVG!</text> |
Tutto
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
<svg width="640" height="640"> <text x="50" y="50" style="fill:blue; font-size:25">Prova SVG!</text> <text x="200" y="50" style="fill:blue; font-size:30">Prova SVG!</text> <text x="400" y="50" style="fill:blue; font-size:35">Prova SVG!</text> <text x="50" y="100" style="stroke:black; fill:blue; font-size:25">Prova SVG!</text> <text x="200" y="100" style="stroke:black; fill:blue; font-size:30">Prova SVG!</text> <text x="400" y="100" style="stroke:black; fill:blue; font-size:35">Prova SVG!</text> <text x="50" y="150" style="fill:blue; font-size:25; font-weight:bolder">Prova SVG!</text> <text x="200" y="150" style="fill:blue; font-size:25; font-style:italic">Prova SVG!</text> <text x="350" y="150" style="fill:blue; font-size:25; font-weight:bolder; font-style:italic">Prova SVG!</text> <text x="50" y="200" style="fill:blue; font-size:25; text-decoration:underline">Prova SVG!</text> <text x="200" y="200" style="fill:blue; font-size:25; text-decoration:line-through">Prova SVG!</text> <text x="350" y="200" style="fill:blue; font-size:25; text-decoration:overline">Prova SVG!</text> <text x="50" y="250" style="fill:blue; font-size:25; font-family:cursive">Prova SVG!</text> <text x="200" y="250" style="fill:blue; font-size:25; font-family:sans-serif">Prova SVG!</text> <text x="350" y="250" style="fill:blue; font-size:25; font-family:monospace">Prova SVG!</text> <text x="50" y="300" style="fill:blue; font-size:25; word-spacing:20">Prova SVG!</text> <text x="50" y="350" style="fill:blue; font-size:25; letter-spacing:20">Prova SVG!</text> </svg> |