{"id":6014,"date":"2019-03-27T12:37:24","date_gmt":"2019-03-27T12:37:24","guid":{"rendered":"https:\/\/www.devopsschool.com\/blog\/?p=6014"},"modified":"2020-01-09T09:29:37","modified_gmt":"2020-01-09T09:29:37","slug":"what-is-html","status":"publish","type":"post","link":"https:\/\/www.devopsschool.com\/blog\/what-is-html\/","title":{"rendered":"What Is HTML?"},"content":{"rendered":"\n<p><\/p>\n\n\n\n<p><strong><em>HTML<\/em><\/strong><em> is a <\/em><strong><em>markup language <\/em><\/strong><em>for creating web documents \/ pages<\/em><\/p>\n\n\n\n<p><strong>1.H<\/strong>yper <strong>T<\/strong>ext <strong>M<\/strong>arkup <strong>L<\/strong>anguage<\/p>\n\n\n\n<p><strong>2<\/strong>.Markup language \u2013 Uses a set of markup tags<\/p>\n\n\n\n<p><strong>3.NOT<\/strong> a programming language<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"> HTML Tags <\/h2>\n\n\n\n<ol class=\"wp-block-list\"><li>HTML tags define HTML elements which is an individual component of an HTML document or web page. <\/li><li>Keywords surrounded by angle brackets <\/li><\/ol>\n\n\n\n[code language=&#8221;html&#8221;]\n\n&lt;p&gt;This is a paragraph element surrounded in paragraph tags&lt;\/p&gt;\n\n[\/code]\n\n\n\n<h2 class=\"wp-block-heading\">Page Structure<\/h2>\n\n\n\n[code language=&#8221;html&#8221;]\n&lt;!DOCTYPE htm&gt;\n&lt;html&gt;\n&lt;head&gt;\n&lt;title&gt;My Webpage&lt;\/title&gt;\n&lt;\/head&gt;\n&lt;body&gt;\n&lt;p&gt;This is my first web page,\/p&gt;\n\n&lt;\/body&gt;\n&lt;\/html&gt;\n[\/code]\n\n\n\n<p><strong>&lt;!DOCTYPE html&gt; &#8211;<\/strong> Declaration defines this document as HTML5<br> <strong>&lt;html&gt; &#8211;<\/strong> Describes an HTML document<br> <strong>&lt;head&gt; &#8211;<\/strong> Provides information about the document<br>  <strong>&lt;title&gt;-<\/strong> Provides a title for the document<\/p>\n\n\n\n<p><strong>&lt;body&gt; &#8211;<\/strong> Describes the visible page content<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"> Common Doctype Declarations <\/h2>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"522\" height=\"298\" src=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2019\/03\/html.jpg\" alt=\"\" class=\"wp-image-6029\" srcset=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2019\/03\/html.jpg 522w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2019\/03\/html-300x171.jpg 300w\" sizes=\"auto, (max-width: 522px) 100vw, 522px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"> Closing Tags <\/h2>\n\n\n\n<p>Not all tags have closing tags like <strong>&lt;p&gt;&lt;\/p&gt;<\/strong><br> Some tags can close themselves<br> Line-Break Tag &#8211; <strong>&lt;br&gt;<\/strong><\/p>\n\n\n\n<p>Self Closing Line-Break Tag &#8211;<strong>&lt;br\/&gt;<\/strong> (Remnant of XHTML)<\/p>\n\n\n\n<figure class=\"wp-block-image\"><img loading=\"lazy\" decoding=\"async\" width=\"498\" height=\"427\" src=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2019\/03\/commontag.jpg\" alt=\"\" class=\"wp-image-6032\" srcset=\"https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2019\/03\/commontag.jpg 498w, https:\/\/www.devopsschool.com\/blog\/wp-content\/uploads\/2019\/03\/commontag-300x257.jpg 300w\" sizes=\"auto, (max-width: 498px) 100vw, 498px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"> Attributes <\/h2>\n\n\n\n<p>Tags can also have \u201cattributes\u201d which include extra bits of information about that tag\/element. Attributes appear in the tag inside of quotation marks<\/p>\n\n\n\n[code language=&#8221;html&#8221;]\n&lt;tag attribute=\u201cvalue\u201d&gt;&lt;\/tag&gt;\n&lt;a href=\u201chttp:\/\/google.com\u201d&gt;Click&lt;\/a&gt;\n&lt;h1 id=\u201cmyHeading\u201d&lt;\/h1&gt;\n[\/code]\n\n\n\n<h2 class=\"wp-block-heading\"> Block Level Elements <\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>Always starts on a new line<\/li><li> \u00a7Takes up full available width <\/li><\/ul>\n\n\n\n[code language=&#8221;html&#8221;]\n&lt;div&gt;\n&lt;h1&gt; &#8211;\n&lt;h6&gt;\n\n&lt;form&gt;\n[\/code]\n\n\n\n<h2 class=\"wp-block-heading\"> Inline Level Elements &nbsp; <\/h2>\n\n\n\n<ul class=\"wp-block-list\"><li>Does not start on a new line<\/li><li>Takes only width necessary <\/li><\/ul>\n\n\n\n[code language=&#8221;html&#8221;]\n&lt;span&gt;\n&lt;a&gt;\n&lt;img&gt;\n[\/code]\n\n\n\n<h2 class=\"wp-block-heading\">\n\n\n\n\n\n\n\n\nCreating A Web Page\n\n\n\n<\/h2>\n\n\n\n<ol class=\"wp-block-list\"><li>Use a text editor or IDE to create your HTML document<\/li><li> Add elements, tags, attributes, etc<\/li><li> Save file with a .html extension<\/li><li> Open it up in a browser \u2013 No server needed<\/li><\/ol>\n\n\n\n<p><\/p>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>HTML is a markup language for creating web documents \/ pages 1.Hyper Text Markup Language 2.Markup language \u2013 Uses a set of markup tags 3.NOT a programming language HTML Tags&#8230; <\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_joinchat":[],"footnotes":""},"categories":[4864],"tags":[],"class_list":["post-6014","post","type-post","status-publish","format-standard","hentry","category-html"],"_links":{"self":[{"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/posts\/6014","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/comments?post=6014"}],"version-history":[{"count":22,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/posts\/6014\/revisions"}],"predecessor-version":[{"id":6042,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/posts\/6014\/revisions\/6042"}],"wp:attachment":[{"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/media?parent=6014"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/categories?post=6014"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.devopsschool.com\/blog\/wp-json\/wp\/v2\/tags?post=6014"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}