Incorpora SVG in HTML - Ecco come
La grafica SVG offre numerosi vantaggi rispetto ai formati di immagine convenzionali. Questo suggerimento pratico mostra come integrare la grafica SVG nei file HTML.
Integra le immagini SVG direttamente in HTML
Esistono vari modi per integrare SVG in HTML. La maggior parte, tuttavia, presenta alcuni inconvenienti.
- È particolarmente facile integrare SVG usando "". Per fare ciò, apri semplicemente il tuo SVG in un editor di codice (ad esempio Notepad ++) e copia il codice nel tuo codice HTML.
- Il codice sorgente del tuo file HTML può richiedere molto tempo perché l'SVG occupa molto spazio.
Includi SVG come componente di immagine in HTML
Un modo semplice per incorporare un file SVG in HTML è usare un tag "img".
- Con il tag "img" puoi incorporare l'SVG come qualsiasi altra immagine. Sebbene sia facile, impedisce anche l'uso di JavaScript e collegamenti all'interno di SVG.
Inserisci SVG con fallback in HTML
Questa opzione è adatta se si utilizza un file SVG ma si desidera anche mantenere un'immagine convenzionale disponibile per i browser meno recenti.
- È possibile utilizzare un tag "image" all'interno del tag "SVG", in cui sono presenti sia l'SVG effettivo sia un'altra immagine con un attributo "xlink: href" e un "src". I browser che non supportano SVG ignorano l'attributo "xlink: href". Tutti gli altri producono l'immagine SVG.
Un altro suggerimento pratico spiega come aprire un file SVG sul tuo computer.