O'Reilly logo

Learning Modernizr by Adam Watson

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Frame 3 – box reflect, HSLA color, and generated content

In this section, we'll be doing the following:

  • Switching color to HSLA
  • Adding CSS reflections
  • Recreating clouds using CSS-generated content :after and :before classes
  • Using CSS Transform to modify the scale of the clouds
  • Swapping the miniature clouds for CSS clouds

In this section we'll introduce a new color type, HSL, which stands for Hue, Saturation, and Lightness. This is yet another way of representing color. In software programs such as Adobe Photoshop there have been multiple ways to express color for some time now.

In Photoshop, for example, documents are typically converted to CMYK (Cyan, Magenta, Yellow, and Black) for use in print, RGB for Web, and even other formats such as LAB, which ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required