Modernizr là gì ?

Trước khi CSS3 và HTML5 ra đời thì đã có khá nhiều trình duyệt cũ, đặc biệt từ phiên bản IE8 trở xuống, tính năng chưa được hỗ trợ nhiều như CSS3 và HTML5. Chính vì vậy mà khi thiết kế website, lập trình viên áp đặt thuộc tính trong CSS3 vào thì những trình duyệt cũ thường báo lỗi hiển thị.

Khắc phục được vấn đề này, Modernizr ra đời. Bản chất của Modernizr là một thư viện JavaScript có nhiệm vụ phát hiện các trình duyệt không hỗ trợ những tính năng mới của CSS# và HTML5. Khi phát hiện ra, Modernizr sẽ chèn vào các đoạn Class thay thế vào bên trong thẻ HTML tương ứng với các tính năng đó.

Ví dụ: Trình duyệt không hiểu tính năng @font-face có trong CSS3,   thì Modernizr sẽ tự động chèn class fontface vào bên trong thẻ html

1
<html class=" fontface ">

Tương tự , nếu trình duyệt không hỗ trợ tính năng multiple backgrounds, CSS gradients hoặc CSS transforms thì nó tiếp tục chèn thêm các class tương ứng như “no-multipebgs“, “no-cssgradients” và  “no-csstransforms“.  và việc mà chúng ta cần làm là chỉ định dạng css thêm cho các class này cho những trình duyệt không hỗ trợ.

Cách sử dụng :

  <script src="modernizr-1.5.min.js"></script>