modernisr是一個小的JavaScript庫，它檢測下一代web技術的本機實現的可用性
HTML5和CSS3引入了一些新特性，但同時許多瀏覽器不支持這些新特性。
modernisr提供了一種簡單的方法來檢測任何新特性，以便您可以採取相應的操作。例如，如果瀏覽器不支持視頻功能，則需要顯示一個簡單的頁面。
您可以根據功能可用性創建CSS規則，如果瀏覽器不支持新功能，這些規則將自動應用於網頁。
您可以從modernizr download下載此實用程序的最新版本。
Syntax
在開始使用Modernizr之前，您必須在HTML頁面標題中包含它的javascript庫，如下所示−
<script src="modernizr.min.js" type="text/javascript"></script>
如上所述，您可以根據功能可用性創建CSS規則，如果瀏覽器不支持新功能，這些規則將自動應用於網頁。
下面是處理受支持和不受支持功能的簡單語法−
/* In your CSS: */
.no-audio #music {
display: none; /* Don't show Audio options */
}
.audio #music button {
/* Style the Play and Pause buttons nicely */
}
<!-- In your HTML: -->
<div id="music">
<audio>
<source src="audio.ogg" />
<source src="audio.mp3" />
</audio>
<button id="play">Play</button>
<button id="pause">Pause</button>
</div>
這裡值得注意的是，您需要在不支持它們的瀏覽器中要處理的每個功能/屬性前面加上前綴「no」。
下面是通過Javascript檢測特定特性的語法−
if (Modernizr.audio) {
/* properties for browsers that
support audio */
}
else{
/* properties for browsers that
does not support audio */
}
Features detected by Modernizr
以下是現代化可以檢測到的特徵列表−