html - 切换 IE7/8 的矢量图

Question

我正在尝试在 IE7/8 中创建站点功能。我已经实现了一个脚本来为我的客户端适配 HTML5，但我遇到了另一个问题：我正在为一些徽标和社交图标使用矢量图像 (.SVG)，这会导致 IE7 和 IE8 在页面加载时挂起.

我的问题是，是否可以使用某种条件语句来加载 IE7/8，比如说，一个 .jpg 版本的向量，以便正确加载页面？

以下是大多数矢量图像在代码中的样子：

<img src="images/logo.svg" alt="-Company Name-">

Answer 1

如果您希望某些内容仅出现在某个版本号以下的 IE 版本中，请使用：

<!--[if lte IE 8]>, lte 意思是“小于或等于”。

有关条件注释的更多信息，请参见 quirksmode.org 页面。

例子：

<!--[if lte IE 8]> Displays in IE8 and below only <![endif]-->
<!--[if gt IE 8]> Displays in IE9 and above only <![endif]-->

Answer 2

作为使用 CSS 的背景图像，该解决方案将更加清晰。

#svg {
    background-image: url('http://upload.wikimedia.org/wikipedia/commons/b/b0/NewTux.svg');
    width: 667px;
    height: 800px;
    background-size: contain;
}

/* IE6 */
* html #svg { 
    background-image: url('otherurl');
}

/* IE7 */
*+html #svg { 
    background-image: url('otherurl');
}

在现代浏览器中查看 http://jsbin.com/eVogAdu/1/edit

对于 IE6 和 IE7 仅查看主页 http://jsbin.com/eVogAdu