How to Create Bold Text in HTML

Rajeev Baniya Feb 02, 2024
  1. Use the strong Tag to Create Bold Text in HTML
  2. Use the b Tag to Create Bold Text in HTML
  3. Use the CSS font-weight Property to Create Bold Text in HTML
How to Create Bold Text in HTML

The tutorial will introduce a few methods to create bold text in HTML.

Use the strong Tag to Create Bold Text in HTML

We can create bold text in HTML using the strong tag. The tag denotes that the text is of vital importance, gravity, or top priority.

The strong tag makes the text bold to show that the text is of greater importance. We should use strong to highlight a text or a portion of it to show its significance in a page or a paragraph.

For example, write a text using the strong tag. Then, wrap the text with the strong tag, as shown in the example below.

The example below creates the text in bold.

Example Code:

<strong> using the strong tag </strong>

Use the b Tag to Create Bold Text in HTML

We can also create bold text in HTML using the b tag. The tag was previously known as the Boldface element.

The b tag is used to focus on the text without showing it is more important. We use the b tag the same way as the strong tag.

For example, write a using b tag and wrap it with the b tag, and the text will be made bold. However, the use of the b tag is not recommended to make the text bold.

Instead, we should use the CSS property font-weight to make the text bolder. We will discuss the property in the next section.

Example Code:

<b> using b tag </b>

Use the CSS font-weight Property to Create Bold Text in HTML

The font-weight CSS property is the most suitable method to make the text bold. We can use inline CSS to apply the styles in HTML.

The font-weight property sets the thickness or the thinness of the text. A variety of options fit the property. When set to normal, the text will be a regular character which is the default.

The option bold makes the text thick, and the option bolder makes it thicker. We can make the text thin with the option lighter.

For example, write a p tag and write inline CSS inside it. Set the font-weight property to bold. Inside the p tag, write the text Using the font-weight property.

Next, write another p tag and write the text Normal text.

In the example below, we have written two different texts. The first text is made bolder, while the second text is normal. Thus, we can use the font-weight property to create bold text in HTML.

Example Code:

<p style="font-weight:bold;">
    Using the font-weight property
</p>

<p>
    Normal text
</p>

Related Article - HTML Text