{"id":197,"date":"2022-04-18T21:20:09","date_gmt":"2022-04-18T21:20:09","guid":{"rendered":"https:\/\/gyanipandit.com\/programming\/?p=197"},"modified":"2023-02-27T10:18:29","modified_gmt":"2023-02-27T10:18:29","slug":"html-heading","status":"publish","type":"post","link":"https:\/\/gyanipandit.com\/programming\/html-heading\/","title":{"rendered":"HTML Heading"},"content":{"rendered":"\n<p class=\"has-text-align-center\"><strong>Tags for Heading (h1 \u2013 h6)<\/strong><\/p>\n\n\n\n<p>Well, many times, when we visit some website, very often, we find some kind of heading, for the document, or for a certain section or something else, but there are some headings present in the document, to get the user&#8217;s attention to that particular section.<\/p>\n\n\n\n<p>Using the heading tags, we specify that the contents within the starting and ending tag are a heading. HTML has 6 heading tags from h1 to h6. h1 is the most important heading (with bigger font size and bold text), to h6, is the least important heading. So, simply we can say that the importance of headings decreases from h1 to h6.<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"HTML Headings | Lecture 4 | HTML tutorial for beginners\" width=\"696\" height=\"392\" src=\"https:\/\/www.youtube.com\/embed\/koU3woMnNm8?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<p>The content between &lt;h1&gt; and &lt;\/h1&gt; defines the heading.<\/p>\n\n\n\n<p>Have a look at the below example, to understand the headings. We have written all 6 headings, so as to get the difference \u2192<\/p>\n\n\n\n<p>if we try to have the output of the above example, we have something like this &#8211;<\/p>\n\n\n\n<p><strong>&lt;!DOCTYPE html&gt;<\/strong><br><strong>&lt;html lang=&#8221;en&#8221;&gt;<\/strong><br><strong>&lt;head&gt;<\/strong><br><strong>&nbsp; &nbsp; &lt;meta charset=&#8221;UTF-8&#8243;&gt;<\/strong><br><strong>&nbsp; &nbsp; &lt;meta http-equiv=&#8221;X-UA-Compatible&#8221; content=&#8221;IE=edge&#8221;&gt;<\/strong><br><strong>&nbsp; &nbsp; &lt;meta name=&#8221;viewport&#8221; content=&#8221;width=device-width, initial-scale=1.0&#8243;&gt;<\/strong><br><strong>&nbsp; &nbsp; &lt;title&gt;Understanding heading&lt;\/title&gt;<\/strong><br><strong>&lt;\/head&gt;<\/strong><br><strong>&lt;body&gt;<\/strong><br><strong>&nbsp; &nbsp;&lt;h1&gt;This is some heading&lt;\/h1&gt;<\/strong><br><strong>&nbsp; &nbsp;&lt;h2&gt;This is some heading&lt;\/h2&gt;<\/strong><br><strong>&nbsp; &nbsp;&lt;h3&gt;This is some heading&lt;\/h3&gt;<\/strong><br><strong>&nbsp; &nbsp;&lt;h4&gt;This is some heading&lt;\/h4&gt;<\/strong><br><strong>&nbsp; &nbsp;&lt;h5&gt;This is some heading&lt;\/h5&gt;<\/strong><br><strong>&nbsp; &nbsp;&lt;h6&gt;This is some heading&lt;\/h6&gt;<\/strong><br><strong>&lt;\/body&gt;<\/strong><br><strong>&lt;\/html&gt;<\/strong><\/p>\n\n\n\n<p>If we try opening the file in the browser, the output is something like this &#8211;<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"353\" src=\"https:\/\/gyanipandit.com\/programming\/wp-content\/uploads\/2022\/04\/HTML-tag.jpg\" alt=\"\" class=\"wp-image-66\" srcset=\"https:\/\/gyanipandit.com\/programming\/wp-content\/uploads\/2022\/04\/HTML-tag.jpg 1024w, https:\/\/gyanipandit.com\/programming\/wp-content\/uploads\/2022\/04\/HTML-tag-300x103.jpg 300w, https:\/\/gyanipandit.com\/programming\/wp-content\/uploads\/2022\/04\/HTML-tag-768x265.jpg 768w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<\/div>\n\n\n<p><br>You can use these heading tags wherever you require to give the headings, but remember that there are different heading tags with some different importance, so, you should give them accordingly, for the main heading of your document, you can choose to keep it as h1.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Tags for Heading (h1 \u2013 h6) Well, many times, when we visit some website, very often, we find some kind of heading, for the document, or for a certain section or something else, but there are some headings present in the document, to get the user&#8217;s attention to that particular section. Using the heading tags, [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5],"tags":[115,116],"class_list":{"0":"post-197","1":"post","2":"type-post","3":"status-publish","4":"format-standard","6":"category-html-tutorial","7":"tag-html-heading","8":"tag-html-tutorial"},"_links":{"self":[{"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/posts\/197","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/comments?post=197"}],"version-history":[{"count":3,"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/posts\/197\/revisions"}],"predecessor-version":[{"id":4961,"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/posts\/197\/revisions\/4961"}],"wp:attachment":[{"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/media?parent=197"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/categories?post=197"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/gyanipandit.com\/programming\/wp-json\/wp\/v2\/tags?post=197"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}