CSS: Selettori

  <svg>
    <rect class="sfondo-svg" />
    <circle id="cerchio-arancio" />
</svg>

Per ottenere il risultato in alto si può includere un file CSS esterno con le seguenti regole:

  
  svg {
    width: 500px;
    height: 500px;
}

regola applicata a ogni elemento svg, indicato senza nessun prefisso

  
  .sfondo-svg {
    x: 0;
    y: 0;
    width: 500px;
    height: 500px;
}

regola applicata a ogni elemento con classe “sfondo-svg”, indicata con il punto iniziale

  
  #cerchio-arancio {
    cx: 250px;
    cy: 250px;
    r: 150;
    fill: orange;
}

regola applicata all’unico elemento con id uguale a “cerchio-arancio”, indicato con il prefisso #

Le possibilità di selezionare gli elementi sono molte di più e l’elenco completo si può trovare nel CSS Selector Reference di W3Schools.