In this video tutorial, we'll discover the advantages of utilizing REMs over pixels for website font sizes.
The tutorial covers making fonts responsive to user preferences in a browser and altering the root font size using a percentage value for greater precision. By utilizing REMs instead of pixels, font sizes can adapt to user preferences, and accessibility concerns for users with visual impairments can be minimized.
To easily add a Style Guide for this tutorial, copy and paste the following code using Emmet onto your website:
| section>h1{Heading 1}+h2{Heading 2}+h3{Heading 3}+p{As Mary sat at a quaint outdoor café in Paris on a warm summer night, she couldn't resist ordering a slice of cheesecake. The creamy, decadent dessert arrived on a delicate plate, adorned with fresh berries and a dollop of whipped cream. With each bite, Mary savored the rich flavor and silky texture of the cheesecake, perfectly complemented by the sweet and tangy berries. As she gazed out at the twinkling lights of the Eiffel Tower in the distance, Mary felt grateful for this moment of indulgence in one of the world's most romantic cities.}+text{Root font size}. |
For additional information on REMs, please visit this link: https://developer.mozilla.org/en-US/docs/Web/CSS/rem.
