DEV Community

Share Point Anchor
Share Point Anchor

Posted on • Originally published at sharepointanchor.com on

1 1

HTML <b> Bold Tag

The HTML tag is used to highlight the bold appearance without conveying any importance. Simply said that it will display the written text in bold format.

Note: According to the HTML 5 specifications, it’s recommended to use the tag only as a last resource , when it is not possible to use other tags.

Syntax:

The bold tag always comes in pairs. The content is written between an opening tag and closing tag.


<b>Text</b>

Enter fullscreen mode Exit fullscreen mode

Sample of the HTML Tag:


<!DOCTYPE html>
<html>
  <head>
    <title>Bold Tag </title>
  </head>
  <body>
    <h2>Sample of Bold Tag</h2>
    <p>This is normal text, and <b>This is the bold text</b></p>
  </body>
</html>

Enter fullscreen mode Exit fullscreen mode

Result:

Result

In this sample, we have created a tag that enclosed the “This is the bold text” , that will display as bold text.

You can also use the following CSS property to set bold text that is “ font-weight: bold; ” Let’s see how:

Example for font-weight property for making the text bold:


<!DOCTYPE html>
<html>
  <head>
    <title>Bold the Text</title>
  </head>
  <body>
    <h2>This is heading</h2>
    <p>This is normal text, and <span style="font-weight:bold;">this is bold text</span>.</p>
  </body>
</html>

Enter fullscreen mode Exit fullscreen mode

Result:

Result

Tag Vs Tag:

In HTML, both the and tags are helps to highlight the text as a bold appearance. The tag should help to markup text as bold without conveying any extra importance. To convey extra importance , you can use the tag.

Tag Styling Methods:

The tag supports the global attributes and the event attributes. You can use the following properties to style an HTML bold tag.

Properties to style the visual weight/emphasis/size of the text in tag:

  • CSS font-style – This CSS property helps to set the font style of the text such as normal, italic, oblique, initial, inherit.
  • CSS font-family – This CSS property specifies a prioritized list of one or more font family names or generic family names for the selected element.
  • CSS font-size – This CSS property will help to set the size of the font.
  • CSS font-weight – This CSS property used to define whether the font should be bold or thick.
  • CSS text-transform – This CSS property will control the text case and capitalization.
  • CSS test-decoration – This CSS property specifies the decoration added to text such as text-decoration-line , text-decoration-color , text-decoration- style.

Styles to coloring the text in Tag:

  • CSS color – This CSS property will specify the color of the text content and decorations.
  • CSS background-color – This CSS property helps to set the background color of an element.

Text layout styles for Tag:

  • CSS text-indent – This CSS property is used to specify the indentation of the first line in a text block.
  • *CSS text-overflow * – This CSS property helps to describe how overflowed content that is not displayed should be signaled to the user.
  • CSS white-space – This CSS property describes how white-space inside an element is handled.
  • CSS word-break – This CSS property decides where the lines should be broken.

Other Properties for Tag:

  • CSS text-shadow – This CSS property helps to add the shadow to text.
  • CSS text-align-last – This CSS property will set the alignment of the last line of the text.
  • CSS line-height – This CSS property defines the height of a line.
  • CSS letter-spacing – This CSS property helps to decide the spaces between letters/characters in a text.
  • CSS word-spacing – This CSS property specifies the spacing between every word.

Browser Support:

Browser Support

Read Also:

The post HTML Bold Tag appeared first on Share Point Anchor.

AWS Security LIVE!

Tune in for AWS Security LIVE!

Join AWS Security LIVE! for expert insights and actionable tips to protect your organization and keep security teams prepared.

Learn More

Top comments (0)

A Workflow Copilot. Tailored to You.

Pieces.app image

Our desktop app, with its intelligent copilot, streamlines coding by generating snippets, extracting code from screenshots, and accelerating problem-solving.

Read the docs