w3docs logo
  1. Snippets
  2. HTML
  3. How to Make the Text Bold in HTML

How to Make the Text Bold in HTML

Solutions with HTML tags

To make the text bold in HTML, you can use the <b> or <strong> tag. They do the same, but they have different meanings.

In this tutorial, you’ll find some examples with <b> and <strong> tags, and we’ll explain the difference between them.

Example of making the text bold with the <b> tag:

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document </title>
  </head>
  <body>
    <p>
      <b>Lorem Ipsum</b> is simply dummy text of the printing and typesetting industry.
    </p>
  </body>
</html>

Result

Lorem Ipsum is simply dummy text of the printing and typesetting industry.

As you can see in the example above, the <b> tag makes the part of a text within it bold. But it is only a style and does not convey additional importance.

In HTML 5, it’s recommended to use the <b> tag only as a last option.

Example of making the text bold with the <strong> tag:

<!DOCTYPE html>
<html>
  <head>
    <title>Title of the document</title>
  </head>
  <body>
    <p>
      It is a long established fact that a reader will be distracted by the readable content of 
      a page when looking at its layout.
      <strong>The point of using Lorem Ipsum</strong>
      is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, 
      content here', making it look like readable English.
    </p>
  </body>
</html>

Here, the <strong> tag is used to convey the strong importance of the content. Thus, it can indicate how a particular part should be understood.

And, we suggest one more way of making the text bold by adding the CSS font-weight property set to “bold” through the style attribute.

Example of making the text bold with the CSS font-weight property:

<!DOCTYPE html>
<html>
  <head>
    <title>HTML text bold</title>
    <style>
      p {
        font-weight: bold;
      }
    </style>
  </head>
  <body>
    <h1>Example</h1>
    <p>Lorem Ipsum</p>
  </body>
</html>

Now, you can choose the most appropriate way for you to make the text bold.

Do you find this helpful?