前言
当我们开发网站时，我们可能需要考虑如何支持旧版本的浏览器。这些浏览器可能不支持 HTML5 和 CSS3 的新特性。为了解决这个问题，一些前端库和工具被开发出来，我们可以使用它们来让我们的网站在旧版本的浏览器中正常工作。本文将介绍四种前端库和工具：Modernizr、html5shiv、ie7.js和CSS3馅饼，并探讨它们的使用场景和指导意义。
Modernizr
Modernizr 是一个 JavaScript 库，用于检测浏览器是否支持 HTML5 和 CSS3 的新特性。通过 Modernizr，我们可以检测浏览器是否支持某些新属性或标签，然后根据检测结果应用不同的样式或 JavaScript 代码。例如，我们可以检测浏览器是否支持 HTML5 中的 <canvas> 标签，如果支持，则可以使用 canvas 绘图功能，否则我们可以提供一些备选方案。
-- -------------------- ---- -------
--------- -----
------
------
---------------- ---------------
------- ----------------------------
-------
---------- -
-------- -----
-
--------
-------
------
------------- ------------
------- ------------------------
-- ------------------------ ---- ------- ---- --- ------- ----- -----------
--------
-- ------------------ -
--- ------ - -------------------------------------
-- --- ---- -- --- ------ ---
-
---------
-------
-------通过上面的代码，我们可以检测浏览器是否支持 <canvas> 标签，如果不支持，则显示一个提示信息。
html5shiv
html5shiv 是一个 JavaScript 库，用于让旧版本的 IE 浏览器支持 HTML5 元素。因为旧版本的 IE 浏览器不支持新的 HTML5 元素，例如 <section>、<article> 和 <nav> 等标签，所以需要使用 html5shiv 来让这些标签在旧版本的 IE 浏览器中正常工作。
-- -------------------- ---- -------
--------- -----
------
------
---------------- ---------------
------- -- -- ---
------- ----------------------------
------------
-------
------
--------
------------- ------------
---------
-----
----
------ ----------------------
------ -----------------------
------ -------------------------
-----
------
---------
----------- ------
-------- ----- ----- --- ----- ----------- ---------- ---------
----------
---------
----------- ------
-------- --------- -------- ---------- -- --- --------- ------ -------------
----------
-------
-------通过上面的代码，我们可以让旧版本的 IE 浏览器支持 HTML5 元素。
ie7.js
ie7.js 是一个 JavaScript 库，用于让旧版本的 IE 浏览器支持一些 CSS3 的新特性和修复一些 CSS 的 bug。例如，ie7.js 可以让旧版本的 IE 浏览器支持 :hover、:before 和 :after 等伪类选择器，并修复 IE6 中的双倍边距 bug。
<!DOCTYPE html>
<html>
<head>
<title>ie7.js Example
> 来源：[JavaScript中文网](https://www.javascriptcn.com/post/14851) ，转载请注明来源
[https://www.javascriptcn.com/post/14851](https://www.javascriptcn.com/post/14851)