HTML and CSS Reference
In-Depth Information
<tspan dy="20" font-weight="bold">TSPAN</tspan>
</text>
quello successivo continui sulla stessa riga.
Figura 10.6
- Testo con tspan allineati su righe differenti.
In generale, il tag
text
è sottoposto alle stesse problematiche dell'HTML5. I font che pos-
siamo utilizzare devono essere tra quelli previsti o già installati sulla macchina dell'utente.
In alternativa, è presente una specifica di nome SVG Font, che permette di creare glyph
e, di fatto, creare font con SVG stesso, per poi utilizzarli. Questa specifica è comunque
in disuso a favore di un altro standard, esclusivamente pensato per i font, di nome
Web
Open Font Format
(WOFF), che permette di distribuire font e di renderli utilizzabili con
HTML5, e che abbiamo approfondito in maniera specifica nei capitoli dedicati ai CSS. Vi-
sto come possiamo inserire elementi testuali, vediamo come SVG ci permette di organiz-
zare la struttura del documento al fine di agevolare il disegno e la manutenzione.
Abbiamo anticipato che i documenti SVG possono diventare complessi, perché possono ri-
chiedere molteplici shape per rappresentare immagini vettoriali che vadano oltre gli esempi
affrontati finora.
Una delle tecniche più usate, soprattutto negli ambienti di disegno, è quella di raggrup-
pare gli elementi. In SVG possiamo farlo attraverso l'elemento
g
, il quale rappresenta un
insieme logico di elementi, ma permette anche di agire su di essi impostando posizioni, di-
mensioni e colori di riempimento da applicare a tutti gli elementi.
Con
l'esempio 10.9
possiamo capirne meglio l'utilità: abbiamo definito un ipotetico lo-
go, con rettangolo e testo, senza specificare i colori di riempimento e delle linee. Queste
due informazioni sono definite, invece, a livello di gruppo, così da agire automaticamente
su tutti i figli.
Esempio 10.9
