Scaler
Academy
Data Science
Neovarsity
New
Skill Test
Free Masterclass
Search for Articles, Topics
Bold Tag in HTML

Bold Tag in HTML

By Bhavya M Modi
6 mins read
Last updated: 1 Jul 2022
164 views
Learn via video course
FREE
View all courses
JavaScript Course With Certification: Unlocking the Power of JavaScript
JavaScript Course With Certification: Unlocking the Power of JavaScript
by Mrinal Bhattacharya
1000
4.8
Start Learning
Start Learning View all courses
JavaScript Course With Certification: Unlocking the Power of JavaScript
JavaScript Course With Certification: Unlocking the Power of JavaScript
by Mrinal Bhattacharya
1000
4.8
Start Learning
Topics Covered

Overview

While making a webpage, often we want the reader's attention. We can do this by using Bold text. To make some text bold, we use Bold tags (<b>). It is known as a Boldface element. It is used for representation purposes only and not to convey any semantic message.

Syntax

Attributes

Bold tag in HTML supports Global Attributes like every other HTML Tag. Some of the global attributes that the bold tag in HTML supports are :-

AttributeDescription
accesskeyIt is used to specify a keyboard shortcut to activate or focus the element.
autocapitalizeIt is used to control if the input is auto capitalized or not.
autofocusIt is used to indicate that the element should be focused.
classIt is used to assign a class name to an element.
contenteditableIt is used to indicate if the content of an element is editable by the user.
contextmenuIt is used to specify a context menu for an element.
dataIt is used to store custom data specific to the page, for an element.
dirIt is used to specify the direction of the element's text.
draggableIt is used to specify whether an element is draggable or not.
dropzoneIt is used to specify whether the dragged data is copied, moved, or linked, when dropped.
hiddenIt is used to indicate if the element is not yet, or is no longer, relevant.
idIt is used to specify a unique ID for an element and it must be unique in the whole document.
langIt is used to specify the primary language for the element's text content.
spellcheckIt is used to specify whether the element may be checked for spelling errors or not.
styleIt is used to specify inline style information for an element.
tabindexIt is used to specify the tabbing order of an element.
titleIt contains text representing advisory information related to the element it belongs to.
translateIt is used to specify whether the text content of an element should be translated or not.

Bold tag in HTML mostly supports all the Event Attributes, but some of the Event attributes have certain rules which may apply to the specific tag. Some of the Event Attributes that the bold tag in HTML supports are:-

AttributesAttributesAttributesAttributes
onabortondragoveronloadeddataonreset
onblurondragstartonloadedmetadataonresize
oncancelondroponloadstartonscroll
oncanplayondurationchangeonmousedownonsecuritypolicyviolation
oncanplaythroughonemptiedonmouseenteronseeked
onchangeonendedonmouseleaveonseeking
onclickonerroronmousemoveonselect
oncloseonfocusonmouseoutonslotchange
oncontextmenuonformdataonmouseoveronstalled
oncopyoninputonmouseuponsubmit
oncutoninvalidonpasteonsuspend
ondragonkeydownonpauseontimeupdate
ondragendonkeypressonplayontoggle
ondragenteronkeyuponplayingonvolumechange
ondragexitonlanguagechangeonprogressonwaiting
ondragleaveonloadonratechangeonwheel

How to use <b> tag in HTML??

Bold tag (<b>) in HTML is used to make text bold. We use it when we want to emphasise something and want the attention of the reader. HTML provides us with <b> tag to format and style text.

  • We use bold tags in HTML to bold keywords in a passage, or to create contrast between the Headline and the Body.
  • Strong tags are very similar to Bold tags, we will discuss them in the next part.
  • We can use the class attributes with bold tags. We can then style it using the class attributes and CSS and we can also add semantic information.

Difference between HTML < b > and < strong > Tags

Bold TagStrong Tag
The bold tags (<b>) are used just to make a piece of text visually bold in HTML.The strong tags (<strong>) are used to format text in HTML and show the importance of a certain part of the text by semantically highlighting it.
The bold tag was made to display the text in bold, so they are used to gain the reader's attention.The strong tags emphasise the text while also making it bold. Strong tags help the HTML to understand what is important.
The bold tags are preferred where we only want to bold a text.An application of strong tags is beautifully shown by browsers made for blind people. The browser can easily understand what part is more important, and what to emphasise. The strong tags are preferred where we want to emphasise a certain part of the text.

Examples

Example 1: Simple Use of < b > Tag

Let us start with a simple example of bold tags.

Example

Output

Simple example of using bold tag

Example 2: Difference between < b > and < p > Tags

Now, let us compare normal paragraph and bold tags.

Example

Output

Difference between Bold and Paragraph tag

Example 3: Difference between < b > and < strong > Tags

Let us see a comparison of <strong> and <b> tags.

Example

Output

Difference between Bold and Strong tag

CSS to Set Bold Text

Now, let us try to bold text using CSS.

Example

Output

Setting CSS to bold

Browser Support

The bold tag in HTML is supported by all modern browsers. Some browsers which support bold tags are :-

  • Chrome (version >=1)
  • Firefox (version >=1)
  • Internet Explorer (version >=2)
  • Edge Mobile
  • Opera
  • Opera Mobile
  • Safari Mobile
  • Samsung Internet

Some related Topics:

Conclusion

  • Bold text is an important part of formatting. A bold tag in HTML is used to gain the reader’s attention by bolding the text.
  • Strong tag <strong> is used to show its importance.
  • We may use these methods to format text and make it bold:
    • using <b> tag
    • using <strong> tag
    • using CSS font-weight