Modernizr allow you to target specific browser functionality in your stylesheet

Modernizr allow you to target specific browser functionality in your stylesheet

Modernizr is a small and simple JavaScript library that helps you take advantage of emerging web technologies (CSS3, HTML 5) while still maintaining a fine level of control over older browsers that may not yet support these new technologies.



Modernizr adds classes to the <html> element which allow you to target specific browser functionality in your stylesheet. You don't actually need to write any Javascript to use it.

Have you ever wanted to do if-statements in your CSS for the availability of cool features like border-radius? Well, with Modernizr you can accomplish just that!

Modernizr uses feature detection to test the current browser against upcoming features like rgba(), border-radius, CSS Transitions and many more. These are currently being implemented across browsers and with Modernizr you can start using them right now, with an easy way to control the fallbacks for browsers that don’t yet support them.

Additionally, Modernizr creates a self-titled global JavaScript object which contains properties for each feature; if a browser supports it, the property will evaluate true and if not, it will be false.

Lastly, Modernizr also adds support for styling and printing HTML5 elements. This allows you to use more semantic, forward-looking elements such as <section>, <header> and <dialog> without having to worry about them not working in Internet Explorer.

Visit Website -

Features detected by Modernizr:

  • @font-face
  • Canvas
  • Canvas Text
  • HTML5 Audio
  • HTML5 Audio formats
  • HTML5 Video
  • HTML5 Video formats
  • rgba()
  • hsla()
  • border-image
  • border-radius
  • box-shadow
  • Multiple backgrounds
  • background-size
  • opacity
  • CSS Animations
  • CSS Columns
  • CSS Gradients
  • CSS Reflections
  • CSS 2D Transforms
  • CSS 3D Transforms
  • CSS Transitions
  • Geolocation API
  • Input Types
  • Input Attributes
  • localStorage
  • sessionStorage
  • Web Workers
  • applicationCache
  • SVG
  • SVG Clip paths
  • SMIL
  • Web SQL Database
  • IndexedDB
  • Web Sockets
  • hashchange Event
  • History Management
  • Drag and Drop
  • Cross-window Messaging

Open Souce Modernizr Information:

  • Applies To: Browser Feature Detection, JavaScript Framework, HTML, Rich Web Application
  • Programming Language: JavaScript
  • Operating System: Cross-platform
  • License: MIT-BSD license

Leave a comment