# 4 Less used HTML tags and their uses As part of this blog we are going to see 4 less used HTML tags during web development ### 1) Refresh the browser or redirect the page Did you know that you can refresh the browser automatically every few seconds with just a single line of code?. Yes, this can be done using the http-equiv="refresh" attribute on the meta tag. ``` ``` - content value for 30 here means , the page will refresh every 30 seconds. Enter the value you want and see the page refresh every few seconds. - if you add a url value followed by the integer, the page will redirect to the given url after the specified time. eg: ``` ``` **Note: **Refresh might have accessibility concerns so use with caution.* ### 2) Calculating with output tag Output tag is used to represent the result of a calculation. In the below example we can calculate sum of two input fields and display it in the output field directly. - > for attribute eg: for="a b" is used to tell the output tag, which fields are used for the manipulation. In the below code pen for attribute value is the id of the two input fields. - > using the name attribute value, the results from the oninput javascript is populated into the output tag. eg: output tag name value is result hence in javascript you can pass the result after calculation using result.value ``` ``` %[https://codepen.io/kpattalam/pen/QWpRKez] ### 3) base tag This tag is very useful when your entire webpage points to the same base URL > The base HTML element specifies the base URL to use for all relative URLs in a document. There can be only one element in a document. ``` Click on this url ``` #### How to use it ?. - In the below codepen, I have specified the base href attribute to my hashnode main blog page. eg: https://kritika-pattalam.hashnode.dev/ - In the anchor tag instead of specifying the absolute URL, I have used the relative URL of my blog post eg : 2-simple-ways-you-can-truncate-text-using-css And the entire blog URL is : https://kritika-pattalam.hashnode.dev/2-simple-ways-you-can-truncate-text-using-css %[https://codepen.io/kpattalam/pen/dyvEOVZ] ### 4) Template tag in HTML - The Content Template element - The HTML **template** tag permits you to declare pieces of HTML sections that can be cloned and embedded into the DOM using script. - The contents of the template tag are not added to the DOM on page load, they are only inserted based on some user interaction. Eg: Lets say there is an image inside the template tag, the image does not get downloaded until the template is cloned and inserted into the DOM structure. %[https://codepen.io/kpattalam/pen/vYxwgGb] Leave me a comment below if you know about other rarely used HTML tags. ### References - mdn docs - [Base Tag](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base) - [http-equiv="refresh"]( https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta) - [output tag](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/output) - [template tag](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/template) Lets connect on [Twitter](https://twitter.com/KritikaPattalam) | [LinkedIn](https://www.linkedin.com/in/kritika-p-296739155/) for more web development related chats.