我可以将HTMLembeddedHTML5 SVG片段吗?
HTML5支持<svg>
标签,允许将SVGembedded到HTML中。
挖深一点,我可以在我的<svg>
片段嵌套一些HTML? 例如,我想在我的SVGgraphics的某个部分放置一个CSS'ed <table>
。
我做了一个小testing,Chrome12不喜欢<svg>
的HTML <p>
<svg>
。 有一些技术,使其工作(如也许是一个HTML容器标签?)?
是的,使用<foreignObject>
元素,请参阅此问题的一些示例。
另外,如果你有一个html5文档,你也可以使用CSS定位和z-index来使部分html显示在svg的顶部。 如果你这样做,你不需要将htmlembedded到svg片段中。 根据我的经验,这会给你在浏览器中最一致的行为。
Internet Explorer不支持外部对象。 请检查ForeignObject
根据目前的W3C链接,你可以Embed SVG Directly Into HTML Pages
。 这是下面的链接,它表示在与HTML4标签相同的HTML。
https://www.w3schools.com/graphics/svg_inhtml.asp
还有其他的也有例子的链接。
https://www.w3schools.com/graphics/svg_intro.asp
https://developer.mozilla.org/en/docs/SVG_In_HTML_Introduction
https://www.w3.org/wiki/HTML/Elements/svg
<!DOCTYPE html> <html> <body> <h1>My first SVG</h1> <svg width="100" height="100"> <circle cx="50" cy="50" r="40" stroke="green" stroke-width="4" fill="yellow" /> </svg> </body> </html>