html svg无法显示,HTML/CSS svg 怎么显示不出来?

HTML/CSS svg 怎么显示不出来?

html/CSS svg 怎么显示不出来? 在 HTML 中引入 svg 文件为何不显示? 下面给大家介绍一下原因和解决方案. 有一定的参考价值, 有需要的朋友可以参考一下, 希望对大家有所帮助.

当 HTML 引入 svg 文件却不显示, 可能由于 svg 不是所有浏览器都支持, Firefox, Chrome 支持, IE 有的低版本不支持.

解决方案:

使用 < embed> 标签

标签被所有主流的浏览器支持, 并允许使用脚本.

注: 当在 HTML 页面中嵌入 SVG 时使用 标签是 Adobe SVG Viewer 推荐的方法! 然而, 如果需要创建合法的 XHTML, 就不能使用 . 任何 HTML 规范中都没有 标签.

例如:(需要下载 adobe 的 svg viewer 插件来显示)

/>

使用 < object> 标签

它是 HTML 4 的标准标签, 被所有较新的浏览器支持. 它的缺点是不允许使用脚本.

注: 假如您安装了最新版本的 Adobe SVG Viewer, 那么当使用 标签时 SVG 文件无法工作 (至少不能在 IE 中工作)!

codebase="http://www.adobe.com/svg/viewer/install/"/>

使用 标签

标签可工作在大部分的浏览器中.

例如:

然后在 rect.svg 里, 通过引用 SVG 的命名空间, 就能够把 SVG 元素之间添加到 HTML 代码中, 这像这样 (这需要浏览器支持 svg, 比如 Firefox, Chrome):

This is an HTML paragraph

/>