<br> : Used to add next line (line breaks) to your page (Single Pair Tag)
<b>: used to make text bold for styling only, without adding any semantic meaning. (unlike <strong>)
<i> : used to display text in italic style without adding semantic meaning (unlike <em>)
<u> : used to display text with an underline style without adding semantic meaning (unlike <ins> which shows inserted/added text).
What is semantic?
In HTML, semantic means the tag carries meaning about the content, not just how it looks.
| Tag | Semantic? | Meaning | Default Style |
|---|---|---|---|
<b> | ❌ Non-semantic | Just makes text bold (styling only). | Bold |
<strong> | ✅ Semantic | Marks text as important/serious. | Bold |
| Tag | Semantic? | Meaning | Default Style |
|---|---|---|---|
<i> |
❌ Non-semantic | Just makes text italic (for styling only). | Italic |
<em> |
✅ Semantic | Emphasizes text (important, stressed). | Italic |
| Tag | Semantic? | Meaning | Default Style |
|---|---|---|---|
<u> | ❌ Non-semantic | Just underlines text (styling only). | Underlined |
<ins> | ✅ Semantic | Indicates text was inserted/added (like edits). | Underlined |
Example:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>HTML MORE TAGs (by rsportfolio)</title>
</head>
<body>
<h3>HTML More Tags</h3>
<hr />
<h3>Bold & Strong Difference?</h3>
<p>This is <b>bold</b> text (style only).</p>
<p>This is <strong>strong</strong> text (important meaning).</p>
<h3>Italic & Emphasized Difference?</h3>
<p>This is <i>italic</i> text (style only).</p>
<p>This is <em>emphasized</em> text (important meaning).</p>
<h3>underlined & Inserted Difference?</h3>
<p>This is <u>underlined</u> text (style only).</p>
<p>This is <ins>inserted</ins> text (newly added).</p>
</body>
</html>
Output:
