Stunning Aesthetics with CSS
The aesthetically focused features of CSS are so useful in responsive web design because using CSS lets us replace images in many situations. This saves you time, makes your code more maintainable, and results in less page "weight" for the end user.
In this chapter, we will cover:
- How to create text shadows
- How to create box shadows
- How to make gradient backgrounds
- How to use multiple backgrounds
- Using CSS background gradients to make patterns
- How to implement high-resolution background images with media queries
- How to use CSS filters (and their performance implications)
- Clipping with clipping paths
- Masking elements with image masks
- Mixing the colors of elements with
mix-blend-mode
Let's dig in.
Vendor prefixes
When implementing experimental CSS, just remember to add relevant vendor prefixes via a tool, rather than by hand. This ensures the broadest...
