转自http://greaterthanme.blog.hexun.com/list.aspx?tag=svg
<embed>
advantage: supported in nearly any browser, allows html2svg and svg2html scripting, is recommended by Adobe for their SVG Viewer disadvantage: not clearly standardized within any HTML specification<object>
advantage: HTML4 and higher standard, supported in newer browser generations disadvantage: works on newer browsers but without html2svg and svg2html scripting.<iframe>
advantage: works in most browsers, but not documented disadvantage: generates a window-like border without specific stylingThe syntax is an old one: <embed src="canvas.svg" width="350" height="176" type="image/svg+xml" name="emap">
An additional attribute is pluginspage that can be set to an URL for the plugin download: pluginspage=http://www.adobe.com/svg/viewer/install/main.html
On Internet Explorer the additional attribute wmode="transparent" can be set to let the html page background shine through.
The syntax is HTML 4 Strict standard: <object type="image/svg+xml" name="omap" data="canvas_norelief.svg" width="350" height="176"></object>
Between the opening and the closing object tag one can be add information for browsers that do not support objects: <object ... ><b>YOU SHOULD UPDATE<br>YOUR BROWSER</b></object>
Unfortunately the some browsers (NN4) do not show this alternative content if type="image/svg+xml" has been set to something else than text/html.
The syntax is only HTML 4 Transitional standard: <iframe src="canvas_norelief.svg" width="350" height="176" name="imap"></iframe>
Between the opening and the closing iframe tag one can be add information for browsers that do not support objects: <iframe ... ><b>YOU SHOULD UPDATE<br>YOUR BROWSER</b></iframe>
It would be great if standards evolve in a sense of compatibility without needing to "embed" one document into another. Such a file could look like the one below (taken from Mobile SVG Profiles at W3C). For now there is only one browser supporting such constructs, Amaya, the W3C's Editor/Browser.
<?xml version="1.0" standalone="yes"?><html xmlns="http://www.w3.org/1999/xhtml" xmlns:svg="http://www.w3.org/2000/svg"> <head> <title xml:lang="en">Sample XHTML + SVG document</title> </head> <body> <svg:svg width="4cm" height="8cm" version="1.1" baseProfile="tiny" > <svg:ellipse cx="2" cy="4" rx="2" ry="1" /> </svg:svg> </body></html>There's a solution that works in most browsers, but note that this is an workaround unsupported by browser and svg viewer authors: It works like this:
<html>... <body>... <iframe src="svgtest.svgz" width="200px" height="200px" frameborder="0" marginwidth="0" marginheight="0" > <embed src="svgtest.svgz" width="200px" height="200px" type="image/svg+xml" /> </iframe>... </body></html>