Miscellaneous Tags

Beyond the core elements, HTML offers a rich set of specialized tags for displaying symbols, defining abbreviations, marking up time, creating interactive disclosures, and more. These tags add precision, accessibility, and interactivity to your pages.

HTML Entities

HTML entities are special codes used to display reserved characters (like < and >) that would otherwise be interpreted as HTML code. They always start with & and end with ;.

| Entity | Result | Description | |--------|--------|-------------| | < | < | Less than | | > | > | Greater than | | & | & | Ampersand | | " | " | Double quote | | ' | ' | Apostrophe | |   | (space) | Non-breaking space | | © | © | Copyright | | ® | ® | Registered trademark | | ™ | ™ | Trademark |

<p>Use &lt;h1&gt; to define the main heading.</p>
<p>Copyright &copy; 2026 CodeWithMishu. All rights reserved.</p>

HTML Symbols

HTML entities can display mathematical and currency symbols:

| Entity | Result | Entity | Result | |--------|--------|--------|--------| | € | € | £ | £ | | ¥ | ¥ | ¢ | ¢ | | $ | $ | ∑ | ∑ | | ∏ | ∏ | √ | √ | | ∞ | ∞ | ∴ | ∴ | | ° | ° | ± | ± |

Emojis in HTML

Emojis are characters from the Unicode character set. You can use them directly or with their hex code:

<p>I love coding! &#128640; &#128187; &#128153;</p>
<p>I love coding! 🚀 💻 💙</p>

Both lines display the same emojis. Using emojis directly in your HTML is simpler and more readable.

The <details> and <summary> Elements

These create an interactive disclosure widget that users can expand and collapse without JavaScript:

<details>
  <summary>Click to expand</summary>
  <p>This content is hidden until the user clicks the summary.</p>
</details>

The open attribute keeps the details visible by default: <details open>.

The <dialog> Element

The <dialog> element creates a modal or non-modal dialog box:

<dialog id="myDialog">
  <h2>Dialog Title</h2>
  <p>This is a native HTML dialog.</p>
  <button onclick="document.getElementById('myDialog').close()">Close</button>
</dialog>
<button onclick="document.getElementById('myDialog').showModal()">Open Dialog</button>

Use .showModal() for a modal (blocks interaction with the rest of the page) or .show() for a non-modal dialog.

Semantic Inline Tags

• <abbr> — abbreviations with a title attribute for the full form: <abbr title="HyperText Markup Language">HTML</abbr>
• <address> — contact information (renders in italics)
• <cite> — title of a creative work (book, article, song)
• <code> — inline code snippets: <code>console.log()</code>
• <kbd> — keyboard input: <kbd>Ctrl</kbd> + <kbd>C</kbd>
• <samp> — sample output from a program
• <time> — dates and times, with datetime attribute for machine-readable format: <time datetime="2026-06-18">June 18, 2026</time>
• <mark> — highlighted / marked text (yellow background by default)

The <bdo> Element

<bdo> overrides text direction. Useful for bi-directional text (Arabic, Hebrew):

<p><bdo dir="rtl">This text is right-to-left.</bdo></p>

The <noscript> Element

<noscript> shows content when JavaScript is disabled in the browser:

<noscript>
  <p>JavaScript is disabled. Please enable it for the best experience.</p>
</noscript>

The <meta> Refresh

You can redirect users after a delay (though server-side redirects are preferred for SEO):

<meta http-equiv="refresh" content="5; url=https://example.com">

This redirects to https://example.com after 5 seconds.