Table of Contents

What is HTML Heading?

The HTML heading tag is used for providing different headings to the HTML document. Headings consists of h1, h2, h3, h4, h5, h6 total 6 headings. HTML heading is used for highlighting headings or subheadings in your HTML document. When you write a heading in between < h1 > </ h1 > then it will show in your browser in bold format with the different sizes depending upon which number you are using in your HTML document.

Syntax-

< h1 > HTML heading </ h1 >

< h2 > HTML heading </ h2 >

< h3 > HTML heading </ h3 >

< h4 > HTML heading </ h4 >

< h5 > HTML heading </ h5 >

< h6 > HTML heading </ h6  >

Example-

				
					<!DOCTYPE html>
<html>
   <head>
      <title>heading</title>
   </head>
<body data-rsssl=1>
     <h1> GEEKY4U.COM </h1> 
     <h2> Learn with Passion</h2> <script data-no-optimize="1" defer>var _extends=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n,o=arguments[e];for(n in o)Object.prototype.hasOwnProperty.call(o,n)&&(t[n]=o[n])}return t},_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t};!function(t,e){"object"===("undefined"==typeof exports?"undefined":_typeof(exports))&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):t.LazyLoad=e()}(this,function(){"use strict";function r(t,e){return t.getAttribute(o+e)}function s(t,e,n){e=o+e,null!==n?t.setAttribute(e,n):t.removeAttribute(e)}function i(t){return r(t,u)===f}function l(t,e){return s(t,d,e),0}function c(t){return r(t,d)}function a(t,e){var n,o="LazyLoad::Initialized",s=new t(e);try{n=new CustomEvent(o,{detail:{instance:s}})}catch(t){(n=document.createEvent("CustomEvent")).initCustomEvent(o,!1,!1,{instance:s})}window.dispatchEvent(n)}var n={elements_selector:"img",container:document,threshold:300,thresholds:null,data_src:"src",data_srcset:"srcset",data_sizes:"sizes",data_bg:"bg",class_loading:"litespeed-loading",class_loaded:"litespeed-loaded",class_error:"error",load_delay:0,callback_load:null,callback_error:null,callback_set:null,callback_enter:null,callback_finish:null,to_webp:!1},o="data-",u="was-processed",d="ll-timeout",f="true";function _(t,e){return e?t.replace(/\.(jpe?g|png)/gi,".webp"):t}function h(t,e,n,o){for(var s,i,a=0;s=t.children[a];a+=1)"SOURCE"===s.tagName&&(i=r(s,n),A(s,e,i,o))}function b(t,e){var n,o,s=e._settings,i=t.tagName;if(i=C[i])return i(t,s),e._updateLoadingCount(1),e._elements=(o=e._elements,n=t,o.filter(function(t){return t!==n})),0;e=t,o=s,t=z&&o.to_webp,s=r(e,o.data_src),o=r(e,o.data_bg),s&&(s=_(s,t),e.style.backgroundImage='url("'+s+'")'),o&&(t=_(o,t),e.style.backgroundImage=t)}function g(t,e){k?t.classList.add(e):t.className+=(t.className?" ":"")+e}function m(t,e){t&&t(e)}function v(t,e,n){t.addEventListener(e,n)}function p(t,e,n){t.removeEventListener(e,n)}function y(t,e,n){p(t,N,e),p(t,S,e),p(t,x,n)}function w(t,e,n){var o=n._settings,s=e?o.class_loaded:o.class_error,i=e?o.callback_load:o.callback_error,e=t.target;t=e,o=o.class_loading,k?t.classList.remove(o):t.className=t.className.replace(new RegExp("(^|\\s+)"+o+"(\\s+|$)")," ").replace(/^\s+/,"").replace(/\s+$/,""),g(e,s),m(i,e),n._updateLoadingCount(-1)}function E(n,o){function s(t){w(t,!0,o),y(n,s,a)}var t,e,i,a=function t(e){w(e,!1,o),y(n,s,t)};i=a,v(t=n,N,e=s),v(t,S,e),v(t,x,i)}function L(t,e,n){R(t,n),e.unobserve(t)}function I(t){var e=c(t);e&&(clearTimeout(e),l(t,null))}var t="undefined"!=typeof window,O=t&&!("onscroll"in window)||/(gle|ing|ro)bot|crawl|spider/i.test(navigator.userAgent),e=t&&"IntersectionObserver"in window,k=t&&"classList"in document.createElement("p"),z=t&&!1,A=function(t,e,n,o){n&&t.setAttribute(e,_(n,o))},C={IMG:function(t,e){var n=z&&e.to_webp,o=e.data_srcset,s=t.parentNode;s&&"PICTURE"===s.tagName&&h(s,"srcset",o,n);s=r(t,e.data_sizes);A(t,"sizes",s);o=r(t,o);A(t,"srcset",o,n);e=r(t,e.data_src);A(t,"src",e,n)},IFRAME:function(t,e){e=r(t,e.data_src);A(t,"src",e)},VIDEO:function(t,e){var n=e.data_src,e=r(t,n);h(t,"src",n),A(t,"src",e),t.load()}},N="load",S="loadeddata",x="error",M=["IMG","IFRAME","VIDEO"];function R(t,e,n){var o=e._settings;!n&&i(t)||(m(o.callback_enter,t),-1<M.indexOf(t.tagName)&&(E(t,e),g(t,o.class_loading)),b(t,e),s(t,u,f),m(o.callback_set,t))}function j(t){return t.isIntersecting||0<t.intersectionRatio}function T(t,e){this._settings=_extends({},n,t),this._setObserver(),this._loadingCount=0,this.update(e)}return T.prototype={_manageIntersection:function(t){var e,n,o,s,i=this._observer,a=this._settings.load_delay,r=t.target;a?j(t)?(e=r,n=i,s=(o=this)._settings.load_delay,(a=c(e))||(a=setTimeout(function(){L(e,n,o),I(e)},s),l(e,a))):I(r):j(t)&&L(r,i,this)},_onIntersection:function(t){t.forEach(this._manageIntersection.bind(this))},_setObserver:function(){var t;e&&(this._observer=new IntersectionObserver(this._onIntersection.bind(this),{root:(t=this._settings).container===document?null:t.container,rootMargin:t.thresholds||t.threshold+"px"}))},_updateLoadingCount:function(t){this._loadingCount+=t,0===this._elements.length&&0===this._loadingCount&&m(this._settings.callback_finish)},update:function(t){var e=this,n=this._settings,n=t||n.container.querySelectorAll(n.elements_selector);this._elements=Array.prototype.slice.call(n).filter(function(t){return!i(t)}),!O&&this._observer?this._elements.forEach(function(t){e._observer.observe(t)}):this.loadAll()},destroy:function(){var e=this;this._observer&&(this._elements.forEach(function(t){e._observer.unobserve(t)}),this._observer=null),this._elements=null,this._settings=null},load:function(t,e){R(t,this,e)},loadAll:function(){var e=this;this._elements.forEach(function(t){e.load(t)})}},t&&function(t,e){if(e)if(e.length)for(var n,o=0;n=e[o];o+=1)a(t,n);else a(t,e)}(T,window.lazyLoadOptions),T}),function(t,e){"use strict";function n(){e.body.classList.add("litespeed_lazyloaded")}function o(){console.log("[LiteSpeed] Start Lazyload image"),s=new LazyLoad({elements_selector:"[data-lazyloaded]",callback_finish:n}),i=function(){s.update()},t.MutationObserver&&new MutationObserver(i).observe(e.documentElement,{childList:!0,subtree:!0,attributes:!0})}var s,i;t.addEventListener?t.addEventListener("load",o,!1):t.attachEvent("onload",o)}(window,document);</script></body>
</html>
				
			

Output:

6.1

What is the h1 heading in HTML?

In HTML document h1 tag indicate the most important heading in your browser. It helps to display main content or text. Whatever is written in between < h1 > </ h1 > tag consider the HTML heading element under the HTML tag.

Syntax- < h1 > HTML heading < h1 >

Example-

				
					<!DOCTYPE html>
<html>
   <head>
      <title>heading</title>
   </head>
   <body data-rsssl=1>
      <h1> GEEKY4U.COM </h1> <script data-no-optimize="1" defer>var _extends=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n,o=arguments[e];for(n in o)Object.prototype.hasOwnProperty.call(o,n)&&(t[n]=o[n])}return t},_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t};!function(t,e){"object"===("undefined"==typeof exports?"undefined":_typeof(exports))&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):t.LazyLoad=e()}(this,function(){"use strict";function r(t,e){return t.getAttribute(o+e)}function s(t,e,n){e=o+e,null!==n?t.setAttribute(e,n):t.removeAttribute(e)}function i(t){return r(t,u)===f}function l(t,e){return s(t,d,e),0}function c(t){return r(t,d)}function a(t,e){var n,o="LazyLoad::Initialized",s=new t(e);try{n=new CustomEvent(o,{detail:{instance:s}})}catch(t){(n=document.createEvent("CustomEvent")).initCustomEvent(o,!1,!1,{instance:s})}window.dispatchEvent(n)}var n={elements_selector:"img",container:document,threshold:300,thresholds:null,data_src:"src",data_srcset:"srcset",data_sizes:"sizes",data_bg:"bg",class_loading:"litespeed-loading",class_loaded:"litespeed-loaded",class_error:"error",load_delay:0,callback_load:null,callback_error:null,callback_set:null,callback_enter:null,callback_finish:null,to_webp:!1},o="data-",u="was-processed",d="ll-timeout",f="true";function _(t,e){return e?t.replace(/\.(jpe?g|png)/gi,".webp"):t}function h(t,e,n,o){for(var s,i,a=0;s=t.children[a];a+=1)"SOURCE"===s.tagName&&(i=r(s,n),A(s,e,i,o))}function b(t,e){var n,o,s=e._settings,i=t.tagName;if(i=C[i])return i(t,s),e._updateLoadingCount(1),e._elements=(o=e._elements,n=t,o.filter(function(t){return t!==n})),0;e=t,o=s,t=z&&o.to_webp,s=r(e,o.data_src),o=r(e,o.data_bg),s&&(s=_(s,t),e.style.backgroundImage='url("'+s+'")'),o&&(t=_(o,t),e.style.backgroundImage=t)}function g(t,e){k?t.classList.add(e):t.className+=(t.className?" ":"")+e}function m(t,e){t&&t(e)}function v(t,e,n){t.addEventListener(e,n)}function p(t,e,n){t.removeEventListener(e,n)}function y(t,e,n){p(t,N,e),p(t,S,e),p(t,x,n)}function w(t,e,n){var o=n._settings,s=e?o.class_loaded:o.class_error,i=e?o.callback_load:o.callback_error,e=t.target;t=e,o=o.class_loading,k?t.classList.remove(o):t.className=t.className.replace(new RegExp("(^|\\s+)"+o+"(\\s+|$)")," ").replace(/^\s+/,"").replace(/\s+$/,""),g(e,s),m(i,e),n._updateLoadingCount(-1)}function E(n,o){function s(t){w(t,!0,o),y(n,s,a)}var t,e,i,a=function t(e){w(e,!1,o),y(n,s,t)};i=a,v(t=n,N,e=s),v(t,S,e),v(t,x,i)}function L(t,e,n){R(t,n),e.unobserve(t)}function I(t){var e=c(t);e&&(clearTimeout(e),l(t,null))}var t="undefined"!=typeof window,O=t&&!("onscroll"in window)||/(gle|ing|ro)bot|crawl|spider/i.test(navigator.userAgent),e=t&&"IntersectionObserver"in window,k=t&&"classList"in document.createElement("p"),z=t&&!1,A=function(t,e,n,o){n&&t.setAttribute(e,_(n,o))},C={IMG:function(t,e){var n=z&&e.to_webp,o=e.data_srcset,s=t.parentNode;s&&"PICTURE"===s.tagName&&h(s,"srcset",o,n);s=r(t,e.data_sizes);A(t,"sizes",s);o=r(t,o);A(t,"srcset",o,n);e=r(t,e.data_src);A(t,"src",e,n)},IFRAME:function(t,e){e=r(t,e.data_src);A(t,"src",e)},VIDEO:function(t,e){var n=e.data_src,e=r(t,n);h(t,"src",n),A(t,"src",e),t.load()}},N="load",S="loadeddata",x="error",M=["IMG","IFRAME","VIDEO"];function R(t,e,n){var o=e._settings;!n&&i(t)||(m(o.callback_enter,t),-1<M.indexOf(t.tagName)&&(E(t,e),g(t,o.class_loading)),b(t,e),s(t,u,f),m(o.callback_set,t))}function j(t){return t.isIntersecting||0<t.intersectionRatio}function T(t,e){this._settings=_extends({},n,t),this._setObserver(),this._loadingCount=0,this.update(e)}return T.prototype={_manageIntersection:function(t){var e,n,o,s,i=this._observer,a=this._settings.load_delay,r=t.target;a?j(t)?(e=r,n=i,s=(o=this)._settings.load_delay,(a=c(e))||(a=setTimeout(function(){L(e,n,o),I(e)},s),l(e,a))):I(r):j(t)&&L(r,i,this)},_onIntersection:function(t){t.forEach(this._manageIntersection.bind(this))},_setObserver:function(){var t;e&&(this._observer=new IntersectionObserver(this._onIntersection.bind(this),{root:(t=this._settings).container===document?null:t.container,rootMargin:t.thresholds||t.threshold+"px"}))},_updateLoadingCount:function(t){this._loadingCount+=t,0===this._elements.length&&0===this._loadingCount&&m(this._settings.callback_finish)},update:function(t){var e=this,n=this._settings,n=t||n.container.querySelectorAll(n.elements_selector);this._elements=Array.prototype.slice.call(n).filter(function(t){return!i(t)}),!O&&this._observer?this._elements.forEach(function(t){e._observer.observe(t)}):this.loadAll()},destroy:function(){var e=this;this._observer&&(this._elements.forEach(function(t){e._observer.unobserve(t)}),this._observer=null),this._elements=null,this._settings=null},load:function(t,e){R(t,this,e)},loadAll:function(){var e=this;this._elements.forEach(function(t){e.load(t)})}},t&&function(t,e){if(e)if(e.length)for(var n,o=0;n=e[o];o+=1)a(t,n);else a(t,e)}(T,window.lazyLoadOptions),T}),function(t,e){"use strict";function n(){e.body.classList.add("litespeed_lazyloaded")}function o(){console.log("[LiteSpeed] Start Lazyload image"),s=new LazyLoad({elements_selector:"[data-lazyloaded]",callback_finish:n}),i=function(){s.update()},t.MutationObserver&&new MutationObserver(i).observe(e.documentElement,{childList:!0,subtree:!0,attributes:!0})}var s,i;t.addEventListener?t.addEventListener("load",o,!1):t.attachEvent("onload",o)}(window,document);</script></body>
</html>

				
			

Output:

6.2

Explain h1 to h6 headings in HTML?

Heading tag consists of six tags which are H1, H2, H3, H4, H5 and H6. < h1 > </ h1 > Represents most important and main heading and < h6 ></ h6 > Represents small heading and least important heading.

H1- < h1 > </ h1 > Define Main heading in HTML document. This heading is use for displaying the main keywords of the HTML document.

H2- < h2 > </ h2 > Define sub heading which come under first main heading.

H3- < h3 > </ h3 > Define second sub heading which comes under your first sub heading.

H4 & H5- These tags are also used for small subheadings accordingly.

H6- < h6 > </ h6 > Defines very small heading which may be not very much important heading in your html document.

Example-

				
					<!DOCTYPE html>
<html>
   <head>
      <title>heading</title>
   </head>
   <body data-rsssl=1>
      <h1> GEEKY4U.com </h1> 
	  <h2> GEEKY4U.com (Learn with Passion) </h2> 
	  <h3> GEEKY4U.com (Learn with Passion) </h3> 
	  <h4> GEEKY4U.com (Learn with Passion) </h4> 
	  <h5> GEEKY4U.com (Learn with Passion) </h5> 
	  <h6> GEEKY4U.com (Learn with Passion) </h6> <script data-no-optimize="1" defer>var _extends=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n,o=arguments[e];for(n in o)Object.prototype.hasOwnProperty.call(o,n)&&(t[n]=o[n])}return t},_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t};!function(t,e){"object"===("undefined"==typeof exports?"undefined":_typeof(exports))&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):t.LazyLoad=e()}(this,function(){"use strict";function r(t,e){return t.getAttribute(o+e)}function s(t,e,n){e=o+e,null!==n?t.setAttribute(e,n):t.removeAttribute(e)}function i(t){return r(t,u)===f}function l(t,e){return s(t,d,e),0}function c(t){return r(t,d)}function a(t,e){var n,o="LazyLoad::Initialized",s=new t(e);try{n=new CustomEvent(o,{detail:{instance:s}})}catch(t){(n=document.createEvent("CustomEvent")).initCustomEvent(o,!1,!1,{instance:s})}window.dispatchEvent(n)}var n={elements_selector:"img",container:document,threshold:300,thresholds:null,data_src:"src",data_srcset:"srcset",data_sizes:"sizes",data_bg:"bg",class_loading:"litespeed-loading",class_loaded:"litespeed-loaded",class_error:"error",load_delay:0,callback_load:null,callback_error:null,callback_set:null,callback_enter:null,callback_finish:null,to_webp:!1},o="data-",u="was-processed",d="ll-timeout",f="true";function _(t,e){return e?t.replace(/\.(jpe?g|png)/gi,".webp"):t}function h(t,e,n,o){for(var s,i,a=0;s=t.children[a];a+=1)"SOURCE"===s.tagName&&(i=r(s,n),A(s,e,i,o))}function b(t,e){var n,o,s=e._settings,i=t.tagName;if(i=C[i])return i(t,s),e._updateLoadingCount(1),e._elements=(o=e._elements,n=t,o.filter(function(t){return t!==n})),0;e=t,o=s,t=z&&o.to_webp,s=r(e,o.data_src),o=r(e,o.data_bg),s&&(s=_(s,t),e.style.backgroundImage='url("'+s+'")'),o&&(t=_(o,t),e.style.backgroundImage=t)}function g(t,e){k?t.classList.add(e):t.className+=(t.className?" ":"")+e}function m(t,e){t&&t(e)}function v(t,e,n){t.addEventListener(e,n)}function p(t,e,n){t.removeEventListener(e,n)}function y(t,e,n){p(t,N,e),p(t,S,e),p(t,x,n)}function w(t,e,n){var o=n._settings,s=e?o.class_loaded:o.class_error,i=e?o.callback_load:o.callback_error,e=t.target;t=e,o=o.class_loading,k?t.classList.remove(o):t.className=t.className.replace(new RegExp("(^|\\s+)"+o+"(\\s+|$)")," ").replace(/^\s+/,"").replace(/\s+$/,""),g(e,s),m(i,e),n._updateLoadingCount(-1)}function E(n,o){function s(t){w(t,!0,o),y(n,s,a)}var t,e,i,a=function t(e){w(e,!1,o),y(n,s,t)};i=a,v(t=n,N,e=s),v(t,S,e),v(t,x,i)}function L(t,e,n){R(t,n),e.unobserve(t)}function I(t){var e=c(t);e&&(clearTimeout(e),l(t,null))}var t="undefined"!=typeof window,O=t&&!("onscroll"in window)||/(gle|ing|ro)bot|crawl|spider/i.test(navigator.userAgent),e=t&&"IntersectionObserver"in window,k=t&&"classList"in document.createElement("p"),z=t&&!1,A=function(t,e,n,o){n&&t.setAttribute(e,_(n,o))},C={IMG:function(t,e){var n=z&&e.to_webp,o=e.data_srcset,s=t.parentNode;s&&"PICTURE"===s.tagName&&h(s,"srcset",o,n);s=r(t,e.data_sizes);A(t,"sizes",s);o=r(t,o);A(t,"srcset",o,n);e=r(t,e.data_src);A(t,"src",e,n)},IFRAME:function(t,e){e=r(t,e.data_src);A(t,"src",e)},VIDEO:function(t,e){var n=e.data_src,e=r(t,n);h(t,"src",n),A(t,"src",e),t.load()}},N="load",S="loadeddata",x="error",M=["IMG","IFRAME","VIDEO"];function R(t,e,n){var o=e._settings;!n&&i(t)||(m(o.callback_enter,t),-1<M.indexOf(t.tagName)&&(E(t,e),g(t,o.class_loading)),b(t,e),s(t,u,f),m(o.callback_set,t))}function j(t){return t.isIntersecting||0<t.intersectionRatio}function T(t,e){this._settings=_extends({},n,t),this._setObserver(),this._loadingCount=0,this.update(e)}return T.prototype={_manageIntersection:function(t){var e,n,o,s,i=this._observer,a=this._settings.load_delay,r=t.target;a?j(t)?(e=r,n=i,s=(o=this)._settings.load_delay,(a=c(e))||(a=setTimeout(function(){L(e,n,o),I(e)},s),l(e,a))):I(r):j(t)&&L(r,i,this)},_onIntersection:function(t){t.forEach(this._manageIntersection.bind(this))},_setObserver:function(){var t;e&&(this._observer=new IntersectionObserver(this._onIntersection.bind(this),{root:(t=this._settings).container===document?null:t.container,rootMargin:t.thresholds||t.threshold+"px"}))},_updateLoadingCount:function(t){this._loadingCount+=t,0===this._elements.length&&0===this._loadingCount&&m(this._settings.callback_finish)},update:function(t){var e=this,n=this._settings,n=t||n.container.querySelectorAll(n.elements_selector);this._elements=Array.prototype.slice.call(n).filter(function(t){return!i(t)}),!O&&this._observer?this._elements.forEach(function(t){e._observer.observe(t)}):this.loadAll()},destroy:function(){var e=this;this._observer&&(this._elements.forEach(function(t){e._observer.unobserve(t)}),this._observer=null),this._elements=null,this._settings=null},load:function(t,e){R(t,this,e)},loadAll:function(){var e=this;this._elements.forEach(function(t){e.load(t)})}},t&&function(t,e){if(e)if(e.length)for(var n,o=0;n=e[o];o+=1)a(t,n);else a(t,e)}(T,window.lazyLoadOptions),T}),function(t,e){"use strict";function n(){e.body.classList.add("litespeed_lazyloaded")}function o(){console.log("[LiteSpeed] Start Lazyload image"),s=new LazyLoad({elements_selector:"[data-lazyloaded]",callback_finish:n}),i=function(){s.update()},t.MutationObserver&&new MutationObserver(i).observe(e.documentElement,{childList:!0,subtree:!0,attributes:!0})}var s,i;t.addEventListener?t.addEventListener("load",o,!1):t.attachEvent("onload",o)}(window,document);</script></body>
</html>

				
			

Output:

6.3

Note- h1 heading represents most important and main heading and h6 heading represents small heading and least important heading.

What is the use of HTML heading Tag?

HTML headings comes with h1, h2, h3, h4, h5, h6 six different types. These 6 different tags use in the heading to highlight different headings according to their importance in the text document. More important headings along with the subheadings and less important headings all the headings used in the HTML text Document so that end-user can understand text documents very easily.

How to make a heading in HTML?

In HTML, for adding HTML heading we need to use of heading tag. This heading tag can come with a Paragraph tag. For writing heading tag < heading > mention which heading tag you wish to use. </ close heading tag > after writing content in it we need to close the heading tag. Syntax and examples with output are given below.

Syntax- < heading tag > some content < heading tag >

Example-

				
					<!DOCTYPE html>
<html>
   <head>
      <title>heading</title>
   </head>
<body data-rsssl=1>
      <h1> GEEKY4U.com </h1> 
	  <h2> GEEKY4U.com (Learn with Passion) </h2> 
	  <p> GEEKY4U.com is a best platform where we are providing you the BEST. </p> <script data-no-optimize="1" defer>var _extends=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var n,o=arguments[e];for(n in o)Object.prototype.hasOwnProperty.call(o,n)&&(t[n]=o[n])}return t},_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t};!function(t,e){"object"===("undefined"==typeof exports?"undefined":_typeof(exports))&&"undefined"!=typeof module?module.exports=e():"function"==typeof define&&define.amd?define(e):t.LazyLoad=e()}(this,function(){"use strict";function r(t,e){return t.getAttribute(o+e)}function s(t,e,n){e=o+e,null!==n?t.setAttribute(e,n):t.removeAttribute(e)}function i(t){return r(t,u)===f}function l(t,e){return s(t,d,e),0}function c(t){return r(t,d)}function a(t,e){var n,o="LazyLoad::Initialized",s=new t(e);try{n=new CustomEvent(o,{detail:{instance:s}})}catch(t){(n=document.createEvent("CustomEvent")).initCustomEvent(o,!1,!1,{instance:s})}window.dispatchEvent(n)}var n={elements_selector:"img",container:document,threshold:300,thresholds:null,data_src:"src",data_srcset:"srcset",data_sizes:"sizes",data_bg:"bg",class_loading:"litespeed-loading",class_loaded:"litespeed-loaded",class_error:"error",load_delay:0,callback_load:null,callback_error:null,callback_set:null,callback_enter:null,callback_finish:null,to_webp:!1},o="data-",u="was-processed",d="ll-timeout",f="true";function _(t,e){return e?t.replace(/\.(jpe?g|png)/gi,".webp"):t}function h(t,e,n,o){for(var s,i,a=0;s=t.children[a];a+=1)"SOURCE"===s.tagName&&(i=r(s,n),A(s,e,i,o))}function b(t,e){var n,o,s=e._settings,i=t.tagName;if(i=C[i])return i(t,s),e._updateLoadingCount(1),e._elements=(o=e._elements,n=t,o.filter(function(t){return t!==n})),0;e=t,o=s,t=z&&o.to_webp,s=r(e,o.data_src),o=r(e,o.data_bg),s&&(s=_(s,t),e.style.backgroundImage='url("'+s+'")'),o&&(t=_(o,t),e.style.backgroundImage=t)}function g(t,e){k?t.classList.add(e):t.className+=(t.className?" ":"")+e}function m(t,e){t&&t(e)}function v(t,e,n){t.addEventListener(e,n)}function p(t,e,n){t.removeEventListener(e,n)}function y(t,e,n){p(t,N,e),p(t,S,e),p(t,x,n)}function w(t,e,n){var o=n._settings,s=e?o.class_loaded:o.class_error,i=e?o.callback_load:o.callback_error,e=t.target;t=e,o=o.class_loading,k?t.classList.remove(o):t.className=t.className.replace(new RegExp("(^|\\s+)"+o+"(\\s+|$)")," ").replace(/^\s+/,"").replace(/\s+$/,""),g(e,s),m(i,e),n._updateLoadingCount(-1)}function E(n,o){function s(t){w(t,!0,o),y(n,s,a)}var t,e,i,a=function t(e){w(e,!1,o),y(n,s,t)};i=a,v(t=n,N,e=s),v(t,S,e),v(t,x,i)}function L(t,e,n){R(t,n),e.unobserve(t)}function I(t){var e=c(t);e&&(clearTimeout(e),l(t,null))}var t="undefined"!=typeof window,O=t&&!("onscroll"in window)||/(gle|ing|ro)bot|crawl|spider/i.test(navigator.userAgent),e=t&&"IntersectionObserver"in window,k=t&&"classList"in document.createElement("p"),z=t&&!1,A=function(t,e,n,o){n&&t.setAttribute(e,_(n,o))},C={IMG:function(t,e){var n=z&&e.to_webp,o=e.data_srcset,s=t.parentNode;s&&"PICTURE"===s.tagName&&h(s,"srcset",o,n);s=r(t,e.data_sizes);A(t,"sizes",s);o=r(t,o);A(t,"srcset",o,n);e=r(t,e.data_src);A(t,"src",e,n)},IFRAME:function(t,e){e=r(t,e.data_src);A(t,"src",e)},VIDEO:function(t,e){var n=e.data_src,e=r(t,n);h(t,"src",n),A(t,"src",e),t.load()}},N="load",S="loadeddata",x="error",M=["IMG","IFRAME","VIDEO"];function R(t,e,n){var o=e._settings;!n&&i(t)||(m(o.callback_enter,t),-1<M.indexOf(t.tagName)&&(E(t,e),g(t,o.class_loading)),b(t,e),s(t,u,f),m(o.callback_set,t))}function j(t){return t.isIntersecting||0<t.intersectionRatio}function T(t,e){this._settings=_extends({},n,t),this._setObserver(),this._loadingCount=0,this.update(e)}return T.prototype={_manageIntersection:function(t){var e,n,o,s,i=this._observer,a=this._settings.load_delay,r=t.target;a?j(t)?(e=r,n=i,s=(o=this)._settings.load_delay,(a=c(e))||(a=setTimeout(function(){L(e,n,o),I(e)},s),l(e,a))):I(r):j(t)&&L(r,i,this)},_onIntersection:function(t){t.forEach(this._manageIntersection.bind(this))},_setObserver:function(){var t;e&&(this._observer=new IntersectionObserver(this._onIntersection.bind(this),{root:(t=this._settings).container===document?null:t.container,rootMargin:t.thresholds||t.threshold+"px"}))},_updateLoadingCount:function(t){this._loadingCount+=t,0===this._elements.length&&0===this._loadingCount&&m(this._settings.callback_finish)},update:function(t){var e=this,n=this._settings,n=t||n.container.querySelectorAll(n.elements_selector);this._elements=Array.prototype.slice.call(n).filter(function(t){return!i(t)}),!O&&this._observer?this._elements.forEach(function(t){e._observer.observe(t)}):this.loadAll()},destroy:function(){var e=this;this._observer&&(this._elements.forEach(function(t){e._observer.unobserve(t)}),this._observer=null),this._elements=null,this._settings=null},load:function(t,e){R(t,this,e)},loadAll:function(){var e=this;this._elements.forEach(function(t){e.load(t)})}},t&&function(t,e){if(e)if(e.length)for(var n,o=0;n=e[o];o+=1)a(t,n);else a(t,e)}(T,window.lazyLoadOptions),T}),function(t,e){"use strict";function n(){e.body.classList.add("litespeed_lazyloaded")}function o(){console.log("[LiteSpeed] Start Lazyload image"),s=new LazyLoad({elements_selector:"[data-lazyloaded]",callback_finish:n}),i=function(){s.update()},t.MutationObserver&&new MutationObserver(i).observe(e.documentElement,{childList:!0,subtree:!0,attributes:!0})}var s,i;t.addEventListener?t.addEventListener("load",o,!1):t.attachEvent("onload",o)}(window,document);</script></body>
</html>

				
			

Output:

6.4

What is the Importance of HTML Heading?

HTML headings are very useful in your HTML documents this will help to look your HTML document or the website easy to understand and very attractive. It is important to understand different HTML heading in HTML. HTML headings help to highlight the important structure of paragraphs more important topics in the document according to the user convenience so that users can easily understand the text or important content in the HTML document. Make sure in the HTML document we should not use HTML headings to make the text bold and big we can only use heading for highlighting purposes.