HTML and CSS Reference
In-Depth Information
Poiché impostiamo lo stile su tutti i tag
text
, non dobbiamo fare altro che definire le tre
etichette all'interno dell'SVG.
Esempio 10.17
<svg>
<!-- ... path omessi... -->
<text x="320" y="230">Blue</text>
<text x="120" y="120">Red</text>
<text x="120" y="320">Yellow</text>
</svg>
Come possiamo verificare nella
figura 10.10
,
otteniamo di conseguenza le tre etichette con
testo in bianco.
Figura 10.10
- I CSS applicati agli elementi SVG consentono di definire più facilmente
gli stili.
Possiamo anche usare gli stili con un nome, specificando il CSS con l'attributo
class
.
In alternativa all'uso degli stili definiti nella sezione
style
, possiamo definire gli stili in
linea, attraverso l'attributo
style
: sebbene quest'ultima tecnica non porti apprezzabili be-
nefici e dovrebbe essere evitata.
Molto interessante e utile è, invece, la possibilità di manipolare gli elementi di un do-
cumento SVG attraverso lo scripting, cioè sfruttando codice JavaScript.
All'inizio del capitolo abbiamo accennato al fatto che SVG, oltre a offrire la possibilità di
realizzare grafica vettoriale, sfrutta una sintassi basata su XML e, come tale, una volta in-
corporato in una pagina HTML (anche in un file esterno), rientra a far parte del
Document
