Yogesh Chauhan's Blog

Useful (and probably ignored) HTML tags: Part 1

in HTML on July 21, 2021

abbr

The abbr tag is used for abbreviation / acronym.

You can use abbr with title attribute or dfn tag to show the description for the abbreviation.

The description will be displayed when an user hovers mouse over the abbreviated text.

address

The address tag is used to show contact information for the author of an article.

The texts will be displayed in italic.

area

The area tag is used to specify an area inside an image. You can make areas clickable in an image using area tag.

You have to nest area inside a map tag.


<img loading="lazy" src="image.jpg" alt="image" usemap="#map" width="200" height="200">

<map name="map">
  <area shape="circle" coords="350,200,22" alt="" href="">
</map>


To generate coords for area tag, you can use this gimp docs.

base

This tag is really handy when you want to have a same base target URL for all links on a page. On anchor tags, you can just specify the relative URL rather than full URL.

An html document MUST not have more than one base tag in it and the base tag needs to be inside a head tag.

bdi

The bdi tag is used to stops a particular texts from formatting itself into a different direction.

This tag is helpful while working with multiple languages texts on the same page since some of those languages requires the texts to start from right while others will requires the texts to start from left.

In that case, it will create a chaotic page. To stop that, use bdi tag to keep one direction for all texts, no matter the language.


Most Read

#1 Solution to the error “Visual Studio Code can’t be opened because Apple cannot check it for malicious software” #2 How to add Read More Read Less Button using JavaScript? #3 How to check if radio button is checked or not using JavaScript? #4 Solution to “TypeError: ‘x’ is not iterable” in Angular 9 #5 How to uninstall Cocoapods from the Mac OS? #6 PHP Login System using PDO Part 1: Create User Registration Page

Recently Posted

#Apr 8 JSON.stringify() in JavaScript #Apr 7 Middleware in NextJS #Jan 17 4 advanced ways to search Colleague #Jan 16 Colleague UI Basics: The Search Area #Jan 16 Colleague UI Basics: The Context Area #Jan 16 Colleague UI Basics: Accessing the user interface
You might also like these
Kubernetes vs. Docker? It’s a misleading phraseMiscellaneousA list of wp-cli commands to use via SSHWordPressJavaScript Data Types and Data Structures Things to RememberJavaScriptCheck If a String Contains a Specific Word in PHPPHPHow to use $INSERT command in Envision Basic?Envision BasicHow to animate list items using CSS and JavaScript?CSS