Rare Html tags you should know
<ABBR>
The <abbr> tag defines an abbreviation or an acronym, like ” HTML”, “CSS,”Mr”., “ASAP”,etc.
Tip: Use the global title attribute to show the description for the abbreviation/ acronym when you mouse over an element.
<p>You can use <abbr title=“Cascading Style Sheets”> CSS</abbr> to style your
<abbr title=“HyperText Markup Language“>HTML</abbr></p>
You can use CSS to style your HTML.
<SUP>
The <sup> tag defines superscript text. Superscript text appears half a character above the normal line,
and is sometimes rendered in a smaller font.
Tip: Use th is tag to define subscript text.
<p>The <b>Pythagorean theorem</b> is often expressed as the following equation:</p>
<p><var>a<sup>2</sup></var> + <var>b<sup> 2</sup></var> =<var>c<sup>2</sup></var></p>
The Pythagorean theorem is often expressed as the following equation:
a2 + b2 = c2
<WBR>
The <wbr> (Word Break Opportunity) tag specifies where in a text it would be OK to add a line break.
Tip: When a word is too long you can use this element to add
<div id=”example-paragraphs”>
<p>Fernstraßenbauprivatfinanzierungsgesetz</p>
<p>Fernstraßen<wbr>bau<wbr>privat<wbr>finanzierungs<wbr>gesetz</p>
<p>Fernstraßen ­ bau shy; privat ­ finanzierung ­ gesetz</p>
</div>
<TIME>
The <time> tag is used to define time in a document.
<p>The Cure will be celebrating their 40th anniversary on <time datetime=“2018-07-07”>July 7</time>
in London’s Hyde Park.</p>
<p>The concert starts at < time datetime = “20: 00 ” > 20:00 </time> and you’11 be able to
enjoy the band for at least< time datetime = “PT2H3M” > 2h 30m</time>.</p>
The Cure will be celebrating their 40th anniversary on July 7 in London’s Hyde Park.
<ADDRESS>
The <address> tag defines the contact information for the owner of a document.
The contact information can be an e-mail address,URL, physical address, phone number, social media handle, etc.
<p>Contact the author of this page:</p>
<address>
<a href=”mai1to:jim@rock com” >jim@rock. com </a><br>
<a href=”tel:+13115552368”>( 311) 555-2368</a>
< /address>
Contact the author of this page:
( 311) 555-238
<DATALIST>
The <datalist> tag specifies a list of pre- defined options for an <input> element. It is used to
provide an “autocomplete” feature. Users will see a drop-down list of predefined options.
<label for=”ice-cream-choice “> Choose a flavor:</label>
<input list=”ice-cream-flavors” id=”ice-cream-choice” name=”ice-cream-choice” />
Choose a flavor:
Chocolate
Coconut
Mint
Strawberry
Vanilla
<datalist id=”ice-cream-flavors”>
<option value=”Chocolate”>
<option value=”Coconut”>
<option value= “Mint”>
<option value=”Strawberry”>
<option value= “Vanilla”>
</datalist>
<OPTGROUP>
The <optgroup> tag is used to group related options in a <select> element (drop down list).
Tip: If you have a long list of options, groups of related options are easier to handle for a user.
<label for=”dino-select”>Choose a dinosaur: </label>
<select id-“dino-select”>
<optgroup label=”Theropods “>
<option> Tyrannosaurus</option>
<option>Velociraptor</option>
<option>Deinonychus</option>
</optgroup>
<optgroup label=”Sauropods”>
<option>Diplodocus</option>
<option>Saltasaurus</option>
<option> Apatosaurus</option>
</optgroup>
< /select>
Choose a dinosaur:
Tyrannosaurus
Theropods
Tyrannosaurus
Velociraptor
Deinonychus
Sauropods
Diplodocus
Saltasaurus
Apatosaurus
<TEMPLATE>
The <template> tag is used as a container to hold some HTML content hidden from the user.
The content inside <template> can be rendered later with JavaScript.
HTML
<div id=”container “></div>
<template id=”template”>
<div>click me</div>
</template>