HTML and CSS Reference
In-Depth Information
Le trasformazioni, inoltre, possono essere combinate separandole dallo spazio, come mo-
strato nell'esempio 10.15 , che sposta e ingrandisce del 10% l'oggetto.
Esempio 10.15
<path fill="url(#blueg)"
d="M 310,402 L 213,214 L 326,35 C 454,111 468,319
310,402 z"
transform="translate(10,-18) scale(1.1, 1.1)" />
A questo punto del capitolo abbiamo affrontato gli elementi necessari per disegnare, ma
sicuramene uno degli aspetti più interessanti di SVG è la sua integrazione con CSS.
Applicare i CSS
Cascading Style Sheets (CSS) è un linguaggio per descrivere la presentazione delle pagine
web. Viene utilizzato da HTML5 per separare le strutture di informazioni che HTML5 rap-
presenta dagli aspetti prettamente grafici e di presentazione.
CSS è molto comodo per definire gli aspetti grafici di un documento HTML, centraliz-
zandone la dichiarazione e permettendone il riutilizzo una o più volte. L'aspetto interessan-
te di SVG è che può lavorare in coppia con i CSS per definire gli attributi di riempimento,
colorazione e font, appena visti nel corso del capitolo.
Anche per SVG possiamo quindi definire degli stili per tag, nominali o per id,
all'interno della pagina stessa o in un file esterno. Riprendiamo ancora una volta la torta e
creiamo uno stile CSS per impostare il colore e le informazioni del font delle etichette da
porre a ogni fetta, come mostrato nell'esempio 10.16 .
Esempio 10.16
<style type="text/css">
text
{
fill: white;
font-family: Tahoma;
font-size: 30px;
}
</style>
 
Search WWH ::




Custom Search