CSS @namespace
La direttiva CSS3 @namespace definisce uno spazio dei nomi XML
La direttiva @namespace permette di associare uno spazio dei nomi a un prefisso, utile per selezionare elementi specifici nei documenti XML o SVG. È fondamentale quando si lavora in ambienti dove coesistono elementi dallo stesso nome ma appartenenti a namespace differenti.
Sintassi
Spiegazione della sintassi:
prefisso(opzionale): Identificatore associato allo spazio dei nomi per usarlo nei selettori con notazioneprefisso|elemento.URI: L'URL o URI che identifica univocamente lo spazio dei nomi. Deve essere racchiuso tra virgolette doppie.
Esempio Direttiva: @namespace
Codice Esempio: @namespace
@namespace svg "http://www.w3.org/2000/svg";
svg|rect {
fill: orange;
stroke: black;
stroke-width: 2;
}svg|circle {
fill: lightblue;
stroke: navy;
stroke-width: 2;
}
Contenuto Esempio: @namespace
Esempio pratico di utilizzo di @namespace con SVG
In questo esempio, viene usato un prefisso per applicare stili solo agli elementi SVG:
CSS e HTML per l’esempio con @namespace:
<style>
@namespace svg "http://www.w3.org/2000/svg";
svg|rect {
fill: orange;
stroke: black;
stroke-width: 2;
}
svg|circle {
fill: lightblue;
stroke: navy;
stroke-width: 2;
}
</style>
<svg xmlns="http://www.w3.org/2000/svg" width="300" height="100">
<rect x="10" y="10" width="100" height="80" />
<circle cx="200" cy="50" r="40" />
</svg>
✅ Note aggiuntive:
Supporto browser: Ampiamente supportata nei browser moderni (tranne IE).
Contesto d'uso: tipicamente nei file CSS collegati a documenti SVG o XHTML.
Non ha effetto nei comuni file HTML (senza namespaces).
Note:
Le indicazioni dei Browser supportati sono superate grazie alla loro costante evoluzione, si consiglia di verificare la compatibilità dei vari browser eseguendo il test cliccando qui sotto.
Supporto Browser
IP: 216.73.216.108
