Chapter 7: How to Build a Responsive Type Scale with Bootstrap
by Craig Watson
In this tutorial, we’ll be taking an in-depth look at how Bootstrap handles typography and how we can modify the code in a couple of different ways to create a responsive type scale. This is often referred to as “responsive typography”, the aim of which is to keep your typography readable on all screen sizes and avoid giant headings on mobiles!
How Bootstrap Sets Up Typography by Default
To understand the way Bootstrap typography works, we need to begin looking into the source
SCSS files to explore the setup and default settings.
Note: for the sake of clarity throughout this tutorial, I’ve commented out styles from the Bootstrap code that are NOT associated with ...