HTML inside SVG

后端 未结 4 1987
梦如初夏
梦如初夏 2021-01-05 10:52

I would like to add some HTML markup in an SVG drawing.

As far as I know, this is not possible with SVG.

The image gets di

4条回答
  •  广开言路
    2021-01-05 11:09

    Since I want to use the css features of HTML the svg element is not enough.

    You can use CSS on , or really any SVG element. The only major difference is that you have to use fill instead of color if you need to change the text color. Where that CSS would live would depend on how you plan on implementing the image on the site. If the SVG is embedded, ie via an tag, the styles would have to be inlined into the SVG file itself, using a tag, as seen below.

    
    
    
    
    
      
      My custom text
      
    

    If you are inlining the SVG, then you can actually think of it as running as HTML -- it, and its child elements, are just normal HTML elements and can be targeted just like any other element. This means that the CSS can be put anywhere you would normally put it - as an external document or in any