Tengo una etiqueta <style> dentro de una imagen svg con la propiedad background-color establecida en blanco. Y estoy agregando dinámicamente este svg al HTML. Como el color de fondo se establece en blanco, todos los demás svgs en la página web heredan esta propiedad que no es deseada. Parece que las propiedades se aplican globalmente, pero quiero aplicar la propiedad a este único svg o este único div
Anteriormente había un atributo de scope para <style> que ahora se eliminó. ¿Cómo puedo lograr esto, especialmente en angular . La view encapsulation angular no funciona en este caso.
<div class="svg-image"> <svg> <style> svg { background-color: white; } </style> <g> . . </g> </svg> </div>aplique una clase personalizada a su svg de la siguiente manera,
aplicación.componente.html
<div class="svg-image"> <svg class="svg-background-white"> <g> . . </g> </svg> </div>aplicación.componente.css
.svg-background-white { background-color: white; }