<b>

  • Revision slug: HTML/Element/b
  • Revision title: b
  • Revision id: 61155
  • Created:
  • Creator: teoli
  • Is current revision? No
  • Comment 51 words added

Revision Content

The HTML B Element (<b>) represents a span of text stylistically different from the normal one, without a conveying any special importance or relevance. Typically keywords in a summary, product names in a review or other span of text that their typical presentation would be boldened. Another example of its use would be to mark up the lead sentence of each paragraph of an article

Usage note:

  • The {{ HTMLElement("b") }} element must not be confused with the {{ HTMLElement("strong") }}, {{ HTMLElement("em") }} or {{ HTMLElement("mark") }} elements. The {{ HTMLElement("strong") }} element represents text of certain importance, {{ HTMLElement("em") }} puts some emphasis on the text and the {{ HTMLElement("mark") }} element represents text of certain relevance. The {{ HTMLElement("b") }} element doen't convey such special semantic information; we can see it as the element to use when no other fit.
  • Similarly, title and headings shouldn't be marked using the {{ HTMLElement("b") }} element. For this usage the {{ HTMLElement("title") }} and {{ HTMLElement("h1") }} to {{ HTMLElement("h6") }} should be used. More, stylesheets can be used to change the default style of this element, meaning that it is not necessarily displayed in bold anymore.
  • Web authors are encouraged to use the class attribute on it in order to convey additional semantic information with it. This is to ease the development of several stylings of a web document, without the need to change its HTML code.
  • Historically, the {{ HTMLElement("b") }} element was meant to bolden text. As styling information has been deprecated since HTML4, its meaning has been changed.

Usage context

Content categories flow content, phrasing content
Permitted content phrasing content
Tag omission none, both the start tag and the end tag are mandatory
Permitted parent elements any element that accept phrasing content
Normative document HTML5, section 4.6.16({{ HTMLVersionInline("4") }} : HTML4.01, section 15.2.1)

DOM Interface

This element implements the HTMLElement interface.

Implementation note: Up to Gecko 1.9.2 inclusive, Firefox implements the HTMLSpanElement interface for this element.

Example

   <p>
   
       This is the first sentence.  <b>This whole sentence is bold.</b>
   
   </p>

Result

This is the first sentence. This whole sentence is bold.

See also: HTML Strong Element

{{ HTML:Element_Navigation() }}

{{ languages( { "de": "de/HTML/Element/b", "pl": "pl/HTML/Element/b" } ) }}

Revision Source

<p>The HTML B Element (<span style="font-family: Courier New;">&lt;b&gt;</span>) represents a span of text stylistically different from the normal one, without a conveying any special importance or relevance. Typically keywords in a summary, product names in a review or other span of text that their typical presentation would be boldened. Another example of its use would be to mark up the lead sentence of each paragraph of an article</p>
<div class="note">
<p><strong>Usage note: <br>
</strong></p>
<ul> <li>The {{ HTMLElement("b") }} element must not be confused with the {{ HTMLElement("strong") }}, {{ HTMLElement("em") }} or {{ HTMLElement("mark") }} elements. The {{ HTMLElement("strong") }} element represents text of certain <em>importance</em>, {{ HTMLElement("em") }} puts some emphasis on the text and the {{ HTMLElement("mark") }} element represents text of certain <em>relevance</em>. The {{ HTMLElement("b") }} element doen't convey such special semantic information; we can see it as the element to use when no other fit.</li> <li>Similarly, title and headings shouldn't be marked using the {{ HTMLElement("b") }} element. For this usage the {{ HTMLElement("title") }} and {{ HTMLElement("h1") }} to {{ HTMLElement("h6") }} should be used. More, stylesheets can be used to change the default style of this element, meaning that it is not <em>necessaril</em><em>y</em><em> </em>displayed in bold anymore.</li> <li>Web authors are encouraged to use the <strong>class</strong> attribute on it in order to convey additional semantic information with it. This is to ease the development of several stylings of a web document, without the need to change its HTML code.</li> <li>Historically, the {{ HTMLElement("b") }} element was meant to bolden text. As styling information has been deprecated since HTML4, its meaning has been changed.</li>
</ul>
</div>
<h2>Usage context</h2>
<table class="fullwidth-table"> <tbody> <tr> <td><a href="/en/HTML/Content_categories" title="en/HTML/Content categories">Content categories</a></td> <td><a href="/en/HTML/Content_categories#flow_content" title="en/HTML/Content categories#flow content">flow content</a>, <a href="/en/HTML/Content_categories#phrasing_content" title="en/HTML/Content categories#phrasing content">phrasing content</a></td> </tr> <tr> <td>Permitted content</td> <td>phrasing content</td> </tr> <tr> <td>Tag omission</td> <td>none, both the <span title="syntax-start-tag">start tag</span> and the <span title="syntax-end-tag">end tag</span> are mandatory</td> </tr> <tr> <td>Permitted parent elements</td> <td>any element that accept phrasing content</td> </tr> <tr> <td>Normative document</td> <td><a class=" external" href="http://www.whatwg.org/specs/web-apps/current-work/multipage/text-level-semantics.html#the-b-element" rel="external nofollow" target="_blank" title="http://www.whatwg.org/specs/web-apps/current-work/multipage/text-level-semantics.html#the-b-element">HTML5, section 4.6.16</a>({{ HTMLVersionInline("4") }} : <a class=" external" href="http://www.w3.org/TR/REC-html40/present/graphics.html#edef-B" title="http://www.w3.org/TR/REC-html40/present/graphics.html#edef-B">HTML4.01, section 15.2.1</a>)</td> </tr> </tbody>
</table><h2>DOM Interface</h2>
<p>This element implements the <code><a href="/en/DOM/element" title="en/DOM/element">HTMLElement</a></code> interface.</p>
<div class="note"><strong>Implementation note: </strong>Up to Gecko 1.9.2 inclusive, Firefox implements the <a href="/en/DOM/span" title="en/DOM/span"><span style="font-family: Courier New;">HTMLSpanElement</span></a> interface for this element.</div>
<h3>Example</h3>
<pre class="eval">   &lt;p&gt;
   
       This is the first sentence.  &lt;b&gt;This whole sentence is bold.&lt;/b&gt;
   
   &lt;/p&gt;
</pre>
<h4>Result</h4>
<p>This is the first sentence. <strong>This whole sentence is bold.</strong></p>
<p>See also: <a href="/en/HTML/Element/strong" title="en/HTML/Element/strong">HTML Strong Element</a></p>
<p>{{ HTML:Element_Navigation() }}</p>
<p>{{ languages( { "de": "de/HTML/Element/b", "pl": "pl/HTML/Element/b" } ) }}</p>
Revert to this revision