w3-video.com logo

HTML5 Tutorial

Home HTML5 XAMPP .htaccess Firefox Notepad++

Share it



h1 h2 h3 h4 h5 h6, display in browser

Browser display, h1, h2, h3, h4, h5, h6 elements


Display type: block


Video demonstration h1, h2, h3, h4, h5, h6 elements, view in browser

HTML5 h1, h2, h3, h4, h5, h6, browser display, Tutorial

min video details
00:05 testing the browser display of the: h1, h2, h3, h4, h5, h6 elements
00:12 for this given structure of the document, we will add the corresponding headings and test their browser display
00:27 h1: start, end tags: no browser display
00:33 h1: the content between the start tag and the end tag: displays in browser
00:44 h2: start, end tags: no browser display
00:50 h2: the content between the start tag and the end tag: displays in browser
01:02 h3: start, end tags: no browser display
01:08 h3: the content between the start tag and the end tag: displays in browser
01:22 note: as the heading rank increases, its size decreases; h3 is smaller than h2 and h2 is smaller than h1
01:30 h4: start, end tags: no browser display
01:38 h4: the content between the start tag and the end tag: displays in browser
01:39 note: h4 i smaller than h3
01:48 h5: start, end tags: no browser display
01:55 h5: the content between the start tag and the end tag: displays in browser
01:55 note: h5 is smaller than h4
02:06 h6: start, end tags: no browser display
02:13 h6: the content between the start tag and the end tag: displays in browser
02:13 note: h6 is smaller than h5 (h6 is the smallest heading)
02:21 using headings with HTML5's new elements: article, section (part of sectioning content), while maintaining the same semantic and display, thing achievable with h1's only inside explicit sections ⁄ nested sections
02:35 same display, a more logical structure
02:38 testing the display in different browsers in both cases:
1. just h1→h6 added like before (HTML4)
2. h1→h6 nested inside new HTML5 sections
02:43 note: same content, same display, 2 different HTML markup: Mozilla Firefox : ok
02:54 Google Chrome: display ok
03:04 Opera version 12.02: display not ok
03:22 Safari: display ok
03:33 Internet Explorer9: display ok
h1...h6 intro h1...h6 parents - children h1...h6 outlineh1...h6 syntax