DEV Community

Cover image for 3 HTML tags you’ve never heard of or used before
Uriel Bitton
Uriel Bitton

Posted on

3 HTML tags you’ve never heard of or used before

HTML does have some strange code sometimes. Let's look at the 3 most uncommon tags that are rarely used and what their purpose is.

1. var tag

As far as its usage goes, its meant to simply denote to a browser that a mathematics variable will go inside the tag, so its not so useful but here's how we can use it.

<p>The area of a triangle is: 1/2 x <var>b</var> x <var>h</var>, where <var>b</var> is the base, and <var>h</var> is the vertical height.</p>
Enter fullscreen mode Exit fullscreen mode

2. samp tag

The samp tag is used to define sample output from a computer program. So its usage is similar to the var tag. Here's an example of how we can use samp.

<p>Message from my computer:</p>
<p><samp>File not found.<br>Press F1 to continue</samp></p>
Enter fullscreen mode Exit fullscreen mode

3. kbd tag

The kbd tag is used to define keyboard input. The content inside is displayed in the browser's default monospace font. Here's an example:

<p>Press <kbd>Ctrl</kbd> + <kbd>C</kbd> to copy text (Windows).</p>
<p>Press <kbd>Cmd</kbd> + <kbd>C</kbd> to copy text (Mac OS).</p>
Enter fullscreen mode Exit fullscreen mode

So there you have it, 3 obscure html tags that are not the most useful but will probably make you look more professional when used in the proper context (at work, for demo purposes).

Top comments (18)

Collapse
 
leob profile image
leob • Edited

I came across another one, VERY obscure, I think way more obscure than these 3 ... the "ins" tag!

developer.mozilla.org/en-US/docs/W...

Came across it just now in a page. Never saw it before, never heard of it ... "ins" ... how bizarre is that!

Collapse
 
urielbitton profile image
Uriel Bitton

Haha yeah definitely weird

Collapse
 
isherwood profile image
Clint Buhs • Edited

Really good stuff. However, It's probably better to refer to these as elements. Tags are text in your markup (of which most elements have two, or at least an opening and implied closing). Elements are components of a web page.

Collapse
 
spiritupbro profile image
spiritupbro • Edited

the dialog tag the one caught me by surprise i use it in my project too for creating a modal using native dialog tag but i dont know how many browser support that but i think most modern browser use that recently

Collapse
 
csqrl profile image
Cam

I actually have used <kbd>. It works great in Markdown for displaying keyboard shortcuts: CTRL+Z. Don't personally see any use case for the other two, however.

Collapse
 
mzaini30 profile image
Zen

I use <code> for these tags. Hehehehe...

Collapse
 
leob profile image
leob

Yeah one cannot help but wonder why these tags were ever invented.

Collapse
 
urielbitton profile image
Uriel Bitton

lol yep

Thread Thread
 
rhymes profile image
rhymes

For semantics I guess

<code> is generic as it can contain anything
<kbd> tells the browser and screenreaders something

Some like <samp> might be redundant?

Thread Thread
 
mzaini30 profile image
Zen

Oh. I forgot about screenreaders.

Collapse
 
volomike profile image
Mike Ross 🇺🇸

Also look at DETAILS and SUMMARY tags. stackoverflow.com/a/38215801/105539

Collapse
 
alhiane profile image
Alhiane Lahcen

nice first time I hear about that

Collapse
 
anevins12 profile image
Andrew Nevins

Bet you haven't heard of <ruby> tags: developer.mozilla.org/en-US/docs/W...

Collapse
 
merichard123 profile image
Richard • Edited

That's awesome! Another interesting one is the xmp or example tag it lets you display raw html code on the site as is.

Collapse
 
urielbitton profile image
Uriel Bitton

yeah but I've used that tag a few times actually, its useful when showing code for others to copy!

Collapse
 
nombrekeff profile image
Keff

I use kbd quite often actually, really nice for showing keyboard keys or key combinations.

Collapse
 
urielbitton profile image
Uriel Bitton

that's cool !