{"id":29884,"date":"2017-05-01T18:01:42","date_gmt":"2017-05-01T10:01:42","guid":{"rendered":"https:\/\/www.hongkiat.com\/blog\/?p=29884"},"modified":"2023-04-06T19:15:12","modified_gmt":"2023-04-06T11:15:12","slug":"html-reference-study-guide-html5","status":"publish","type":"post","link":"https:\/\/www.hongkiat.com\/blog\/html-reference-study-guide-html5\/","title":{"rendered":"HTML5 Reference: Your Ultimate Study Guide"},"content":{"rendered":"

There\u2019s so much to learn HTML and the HTML Reference<\/a><\/strong> site is made to help<\/strong>. Every HTML element has its base tag<\/strong> and attributes<\/strong> that go along with it.<\/p>\n

HTML Reference covers all these elements & attributes, along with more specific properties<\/strong> such as which tags are self-closing and which tags are block-level vs. inline by default.<\/p>\n

\"html5<\/a><\/figure>\n

You can always learn the basics of HTML from online tutorials and free YouTube videos. But it\u2019s hard to find a truly detailed guide<\/strong> covering everything you\u2019d ever want to know about HTML.<\/p>\n

\n\t\t\t\t\tRead Also:<\/strong>\u00a0\n\t\t\t\t\t10 Cool Things HTML Tags Can Do<\/a>\n\t\t\t\t<\/p>\n

Thankfully, that\u2019s exactly what this site is and it\u2019s offered online at no cost<\/strong> with an easy-to-use interface<\/strong>.<\/p>\n

It works as one big home page where you scroll through elements from A-Z<\/strong>. Each element has four optional propertie<\/strong>s, and as you scroll through you\u2019ll notice some elements have certain properties applied while others don\u2019t.<\/p>\n

By default, web browsers render certain elements differently<\/strong> than others. This is an inherent structure of HTML and it\u2019s organized by the W3C. You can always browse through W3C\u2019s website<\/a> to find this information but the HTML Reference site makes it so much easier<\/strong>.<\/p>\n

Each HTML element can have four properties<\/strong>:<\/p>\n

    \n
  1. meta<\/li>\n
  2. self-closing<\/li>\n
  3. inline<\/li>\n
  4. block<\/li>\n<\/ol>\n

    All meta tags are typically used inside the header<\/strong> rather than the page body. Self-closing tags do not require a second tag<\/strong> to close, and most developers just need to memorize which tags are self-closing & which aren\u2019t.<\/p>\n

    The inline and block properties are the opposites of each other<\/strong>. They have more to do with CSS display properties<\/a> but they\u2019re inherent to certain HTML elements<\/strong>. And, if you\u2019re ever unsure you can check this site for proof (that\u2019s what it\u2019s here for!)<\/p>\n

    \"html<\/a><\/figure>\n

    HTML Reference also offers deeper pages<\/strong> covering topics such as HTML lists<\/a> and forms<\/a>, all with live examples<\/strong> using proper HTML5 syntax.<\/p>\n

    This guide is truly the ultimate reference for anyone learning or trying to improve their HTML skills. And, best of all, the project is totally open source<\/a>, so you can download it locally<\/strong> if you want a copy on your machine.<\/p>\n

    \n\t\t\t\t\tRead Also:<\/strong>\u00a0\n\t\t\t\t\tA Look Into Proper HTML5 Semantics<\/a>\n\t\t\t\t<\/p>","protected":false},"excerpt":{"rendered":"

    There\u2019s so much to learn HTML and the HTML Reference site is made to help. Every HTML element has its base tag and attributes that go along with it. HTML Reference covers all these elements & attributes, along with more specific properties such as which tags are self-closing and which tags are block-level vs. inline…<\/p>\n","protected":false},"author":18,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[352],"tags":[506],"topic":[4520],"class_list":["entry-content","is-maxi"],"acf":[],"yoast_head":"\nHTML5 Reference: Your Ultimate Study Guide - Hongkiat<\/title>\n<meta name=\"description\" content=\"There's so much to learn HTML and the HTML Reference site is made to help. Every HTML element has its base tag and attributes that go along with it. HTML\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.hongkiat.com\/blog\/html-reference-study-guide-html5\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"HTML5 Reference: Your Ultimate Study Guide\" \/>\n<meta property=\"og:description\" content=\"There's so much to learn HTML and the HTML Reference site is made to help. Every HTML element has its base tag and attributes that go along with it. HTML\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.hongkiat.com\/blog\/html-reference-study-guide-html5\/\" \/>\n<meta property=\"og:site_name\" content=\"Hongkiat\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/hongkiatcom\" \/>\n<meta property=\"article:published_time\" content=\"2017-05-01T10:01:42+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2023-04-06T11:15:12+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/assets.hongkiat.com\/uploads\/html-reference-study-guide-html5\/01-html-reference-homepage.jpg\" \/>\n<meta name=\"author\" content=\"Jake Rocheleau\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:creator\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:site\" content=\"@hongkiat\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"Jake Rocheleau\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"2 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-reference-study-guide-html5\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-reference-study-guide-html5\\\/\"},\"author\":{\"name\":\"Jake Rocheleau\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/966b2daea15283b4145e71aa98a82c2a\"},\"headline\":\"HTML5 Reference: Your Ultimate Study Guide\",\"datePublished\":\"2017-05-01T10:01:42+00:00\",\"dateModified\":\"2023-04-06T11:15:12+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-reference-study-guide-html5\\\/\"},\"wordCount\":359,\"commentCount\":1,\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-reference-study-guide-html5\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/html-reference-study-guide-html5\\\/01-html-reference-homepage.jpg\",\"keywords\":[\"HTML\"],\"articleSection\":[\"Web Design\"],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-reference-study-guide-html5\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-reference-study-guide-html5\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-reference-study-guide-html5\\\/\",\"name\":\"HTML5 Reference: Your Ultimate Study Guide - Hongkiat\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-reference-study-guide-html5\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-reference-study-guide-html5\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/html-reference-study-guide-html5\\\/01-html-reference-homepage.jpg\",\"datePublished\":\"2017-05-01T10:01:42+00:00\",\"dateModified\":\"2023-04-06T11:15:12+00:00\",\"description\":\"There's so much to learn HTML and the HTML Reference site is made to help. Every HTML element has its base tag and attributes that go along with it. HTML\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-reference-study-guide-html5\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-reference-study-guide-html5\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-reference-study-guide-html5\\\/#primaryimage\",\"url\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/html-reference-study-guide-html5\\\/01-html-reference-homepage.jpg\",\"contentUrl\":\"https:\\\/\\\/assets.hongkiat.com\\\/uploads\\\/html-reference-study-guide-html5\\\/01-html-reference-homepage.jpg\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/html-reference-study-guide-html5\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"HTML5 Reference: Your Ultimate Study Guide\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"name\":\"Hongkiat\",\"description\":\"Tech and Design Tips\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#organization\",\"name\":\"Hongkiat.com\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"contentUrl\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/wp-content\\\/uploads\\\/hkdc-logo-rect-yoast.jpg\",\"width\":1200,\"height\":799,\"caption\":\"Hongkiat.com\"},\"image\":{\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"sameAs\":[\"https:\\\/\\\/www.facebook.com\\\/hongkiatcom\",\"https:\\\/\\\/x.com\\\/hongkiat\",\"https:\\\/\\\/www.pinterest.com\\\/hongkiat\\\/\"]},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/#\\\/schema\\\/person\\\/966b2daea15283b4145e71aa98a82c2a\",\"name\":\"Jake Rocheleau\",\"description\":\"Jake is a writer and designer with over 10 years experience working on the web. He writes about user experience design and cool resources for designers\",\"sameAs\":[\"https:\\\/\\\/www.hongkiat.com\"],\"url\":\"https:\\\/\\\/www.hongkiat.com\\\/blog\\\/author\\\/jake\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"HTML5 Reference: Your Ultimate Study Guide - Hongkiat","description":"There's so much to learn HTML and the HTML Reference site is made to help. Every HTML element has its base tag and attributes that go along with it. HTML","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.hongkiat.com\/blog\/html-reference-study-guide-html5\/","og_locale":"en_US","og_type":"article","og_title":"HTML5 Reference: Your Ultimate Study Guide","og_description":"There's so much to learn HTML and the HTML Reference site is made to help. Every HTML element has its base tag and attributes that go along with it. HTML","og_url":"https:\/\/www.hongkiat.com\/blog\/html-reference-study-guide-html5\/","og_site_name":"Hongkiat","article_publisher":"https:\/\/www.facebook.com\/hongkiatcom","article_published_time":"2017-05-01T10:01:42+00:00","article_modified_time":"2023-04-06T11:15:12+00:00","og_image":[{"url":"https:\/\/assets.hongkiat.com\/uploads\/html-reference-study-guide-html5\/01-html-reference-homepage.jpg","type":"","width":"","height":""}],"author":"Jake Rocheleau","twitter_card":"summary_large_image","twitter_creator":"@hongkiat","twitter_site":"@hongkiat","twitter_misc":{"Written by":"Jake Rocheleau","Est. reading time":"2 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.hongkiat.com\/blog\/html-reference-study-guide-html5\/#article","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-reference-study-guide-html5\/"},"author":{"name":"Jake Rocheleau","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/966b2daea15283b4145e71aa98a82c2a"},"headline":"HTML5 Reference: Your Ultimate Study Guide","datePublished":"2017-05-01T10:01:42+00:00","dateModified":"2023-04-06T11:15:12+00:00","mainEntityOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-reference-study-guide-html5\/"},"wordCount":359,"commentCount":1,"publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-reference-study-guide-html5\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/html-reference-study-guide-html5\/01-html-reference-homepage.jpg","keywords":["HTML"],"articleSection":["Web Design"],"inLanguage":"en-US","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.hongkiat.com\/blog\/html-reference-study-guide-html5\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.hongkiat.com\/blog\/html-reference-study-guide-html5\/","url":"https:\/\/www.hongkiat.com\/blog\/html-reference-study-guide-html5\/","name":"HTML5 Reference: Your Ultimate Study Guide - Hongkiat","isPartOf":{"@id":"https:\/\/www.hongkiat.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-reference-study-guide-html5\/#primaryimage"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-reference-study-guide-html5\/#primaryimage"},"thumbnailUrl":"https:\/\/assets.hongkiat.com\/uploads\/html-reference-study-guide-html5\/01-html-reference-homepage.jpg","datePublished":"2017-05-01T10:01:42+00:00","dateModified":"2023-04-06T11:15:12+00:00","description":"There's so much to learn HTML and the HTML Reference site is made to help. Every HTML element has its base tag and attributes that go along with it. HTML","breadcrumb":{"@id":"https:\/\/www.hongkiat.com\/blog\/html-reference-study-guide-html5\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.hongkiat.com\/blog\/html-reference-study-guide-html5\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/html-reference-study-guide-html5\/#primaryimage","url":"https:\/\/assets.hongkiat.com\/uploads\/html-reference-study-guide-html5\/01-html-reference-homepage.jpg","contentUrl":"https:\/\/assets.hongkiat.com\/uploads\/html-reference-study-guide-html5\/01-html-reference-homepage.jpg"},{"@type":"BreadcrumbList","@id":"https:\/\/www.hongkiat.com\/blog\/html-reference-study-guide-html5\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/www.hongkiat.com\/blog\/"},{"@type":"ListItem","position":2,"name":"HTML5 Reference: Your Ultimate Study Guide"}]},{"@type":"WebSite","@id":"https:\/\/www.hongkiat.com\/blog\/#website","url":"https:\/\/www.hongkiat.com\/blog\/","name":"Hongkiat","description":"Tech and Design Tips","publisher":{"@id":"https:\/\/www.hongkiat.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.hongkiat.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/www.hongkiat.com\/blog\/#organization","name":"Hongkiat.com","url":"https:\/\/www.hongkiat.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","contentUrl":"https:\/\/www.hongkiat.com\/blog\/wp-content\/uploads\/hkdc-logo-rect-yoast.jpg","width":1200,"height":799,"caption":"Hongkiat.com"},"image":{"@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/hongkiatcom","https:\/\/x.com\/hongkiat","https:\/\/www.pinterest.com\/hongkiat\/"]},{"@type":"Person","@id":"https:\/\/www.hongkiat.com\/blog\/#\/schema\/person\/966b2daea15283b4145e71aa98a82c2a","name":"Jake Rocheleau","description":"Jake is a writer and designer with over 10 years experience working on the web. He writes about user experience design and cool resources for designers","sameAs":["https:\/\/www.hongkiat.com"],"url":"https:\/\/www.hongkiat.com\/blog\/author\/jake\/"}]}},"jetpack_featured_media_url":"https:\/\/","jetpack_shortlink":"https:\/\/wp.me\/p4uxU-7M0","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/29884","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/users\/18"}],"replies":[{"embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/comments?post=29884"}],"version-history":[{"count":3,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/29884\/revisions"}],"predecessor-version":[{"id":65875,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/posts\/29884\/revisions\/65875"}],"wp:attachment":[{"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/media?parent=29884"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/categories?post=29884"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/tags?post=29884"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/www.hongkiat.com\/blog\/wp-json\/wp\/v2\/topic?post=29884"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}