HTML Bold Tag Usage and Examples – POFTUT

HTML Bold Tag Usage and Examples


HTML provides different tags for styling. Bold  <b> tag is used to make given text bold which is ticker than a normal one. Bold tag is used for the start and end of the text to specify the text we want to make bold.

<b> Bold Tag

As stated previously bold tag is used by specifying the start and the end of the text block we want to make bold. Bold tag is only effective in the normal text which means using the bold tag in Header tags like H1, h2 do not have any difference.

<html>
   <body>
      <h1><b>This header is bold</b></h1>
      <h1>This header is not bold</h1>
      <b>This text is bold</b>
      <br>
      This text is not bold
   </body>
</html>
"<b
<b> Bold Tag

Make Bold with CSS

Bold is generally used as a tag inside the HTML body by surrounding the text. But We can make the bold specified text by using CSS. The CSS attribute is named font-weight like below. In this example, we will define a CSS class named bold and apply by using span tag like below.

<html>
   <body>
      <span style="font-weight:bold;">This text is bold</span><br>
      This text is not bold
      <div style="font-weight:bold;"> This div  content is bold</div>
      This div content is not bold
   </body>
</html>
Make Bold with CSS
Make Bold with CSS

HTML Do Not Have <bold> Tag

Some novice web programmers and designers assume that there is a tag named <bold>. This is not true. The bold tag is represented as <b> not with <bold> If we try to use <bold> as a tag it will not work like below.

<html>
   <body>
      <b>This text is bold</b> <br>
      <bold>This text is not bold</bold>
      <br>
      This text is not bold
   </body>
</html>
"HTML

Text Formatting Elements

Bold tag is named as text formatting element and there are other text formatting elements that can be used for different purposes. Some of the text formatting elements or tags may provide a similar experience to the bold but they are not the same.

  • <b> is used for bold text.
  • <strong> is used for important text.
  • <i>  is used for italic text where the text will be leaned
  • <em> is used for emphasized text
  • <mark> is used for marking text
  • <small> is used for making text smaller
  • <del> deleted text
  • <ins> is used for inserted text
  • <sub> is used for subscribed text
  • <sup> is used superscript like formulas

Bold Tag Alternatives Strong Tag, Emphasize, Mark, Head1

There are some tags that are similar to bold investigate them which are used for what and differences with the <bold> tag.

  • <b>  is used to differentiate stylistically from other text and there is no extra importance, keyword, product name.
  • <em> is used to stress the emphasis of its contents. This can be a keyword, product name, etc.
  • <h1> , <h2> , <h3> , … are used to create headers which simply describes text sections or parts .
  • <mark> is used to reference some keyword, name, header, etc at the end of the document.
  • <strong>  is used to provide some important to the given text.
<html>
   <body>
      <b>This text is bold</b> <br>
      <em> This text is em </em> <br>
      <mark> This text is mark </mark> <br>
      <h1> This text is h1 </h1>
      <br>
      <strong> This text is strong </strong> <br>
   </body>
</html>
Bold Tag Alternatives Strong Tag, Emphasize, Mark, Head1
Bold Tag Alternatives Strong Tag, Emphasize, Mark, Head1

LEARN MORE  Php - Syntax Overview

Leave a Comment