'Set font-weight using Bootstrap classes

Is there any Twitter Bootstrap class for font-weight: bold and other values of font-weight?

I would not create a new one if this already exists in Bootstrap.

htmlcsstwitter-bootstraptwitter-bootstrap-3


Solution 1:[1]

I found this on the Bootstrap website, but it really isn't a Bootstrap class, it's just HTML.

<strong>rendered as bold text</strong>

Solution 2:[2]

In Bootstrap 4:

class="font-weight-bold"

Or:

<strong>text</strong>

Solution 3:[3]

Create in your Site.css (or in another place) a new class named for example .font-bold and set it to your element

.font-bold {
  font-weight: bold;
}

Solution 4:[4]

On Bootstrap 4 you can use:

<p class="font-weight-bold">Bold text.</p>
<p class="font-weight-normal">Normal weight text.</p>
<p class="font-weight-light">Light weight text.</p>

Solution 5:[5]

The most accurate way of how to do it if using Boostrap 5 is as in example below:

<p class="fw-bold">Bold text.</p>

Solution 6:[6]

You should use bootstarp's variables to control your font-weight if you want a more customized value and/or you're following a scheme that needs to be repeated ; Variables are used throughout the entire project as a way to centralize and share commonly used values like colors, spacing, or font stacks;

you can find all the documentation at http://getbootstrap.com/css.

Solution 7:[7]

If you are checking this in Mac Version of Chrome, i think there is some browser incompatibility.

try this

* {-webkit-font-smoothing: antialiased;}

Solution 8:[8]

For Bootstrap 5:

class="fw-bold"

For Bootstrap 4

class="font-weight-bold"

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Stacked
Solution 2 Jeremy Lynch
Solution 3 Spikolynn
Solution 4 danramzdev
Solution 5 st35ly
Solution 6 maioman
Solution 7 Lahiru Pinto
Solution 8 Fábio Rodrigues Fonseca

Related Questions