Is it not possible to change font family of <body> in Bootstrap 5?

Issue

The Font-Family changes for my heading tags, but my body tag keeps getting canceled out by the "_reboot.scss:50". Also when I inspect my webpage and toggle off the default "enter code herefont-family: var(–bs-body-font-family);" the font I have selected in the CSS works.

Tried Both Import and Link for the Google Font :

<style>
  @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@300;900&display=swap');
</style>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;900&display=swap" rel="stylesheet">

Css Selector :

body {
  font-family: 'Montserrat', sans-serif;
}

Solution

use !important to override css.
Example –

body {
  font-family: 'Montserrat', sans-serif !important;
}

Answered By – Vidiya Prasanth Pappannan

Answer Checked By – Clifford M. (AngularFixing Volunteer)

Leave a Reply

Your email address will not be published.