HTML DOCTYPE | Standards vs Quirks mode | HTML 5 Tutorial - 1

hi everyone welcome to how to do it today we're going to learn about doctype in html if you go to any website and if you take a look at the source code of that particular web page so the doctype html is the very first line of code you will notice so for example now i'm going to the wikipedia site and you read the source code of this page you can see doctype.html is the very first line of code in this page what is this doctype why we use doctype in html for example you can see this is a chord of a sample webpage so here i have defined the dot type html as a first line of code doctype declaration is the very first thing in your html document before starting the html tag doctype declaration is not an html tag it is an instruction to the web browser about what version of html the page is written in the doctype helps the browser to render your page correctly so always you have to add the doctype as the first line of your code so browser knows what type of document to expect when you define the doctype in your webpage so the doctype html code needs to be written in all the pages in order to get that page rendered in a correct way in the browser so different version of html has different ways of defining the doctype so now this is the way that we define the doctype html code in the html5 version html5 is the latest version that we are using now so in other versions of html so we there are different methods available to define the doctype when you define the doctype html in your document the websites gets rendered in standard compliance mode if you don't define the doctype html in your document your web page gets rendered in quarks mode so there are differences when the page gets rendered in standard mode and the quarks mode so for example i'll show you two pages so you can see these two pages so these two pages are almost with the same content but this page is width doctype and this page is without doctype when in standard mode the browser renders the page respecting all implemented standards in the coax mode that could cause unexpected efforts to your webpage for example now if i go to inspect of this page and you can see inside the head tag i have written a style class called paragraph style that is in uppercase letters and also you can see in the p tag i have called this class in lowercase letters i have written the color green for this style but the style is not applied here but if i go to this page this page is without look type and you can see inside the head tag i have the same class with uppercase letters and inside the body tag in the paragraph i have called this class paragraph styled in lowercase letters but the style is still applied so it means when you call the class names and the id names in the page that is without doctype that is not going to be case sensitive in this document so in the page where that is with the doctype when you call the classes and the ids that is going to be case sensitive also you can see in this page i have defined the dog type and there is a top margin that has got applied but in this page there is no top margin so to summarize doctype declaration should go as a first line in every html document you create in order to get your page rendered in standard compliance mode and you should only use doctype html from now as the latest html version is html file in this video we have learned about what is doctype and why we use doctype in html if you like this video please click on the like button and don't forget to subscribe to this channel thank you very much

Channel: HowToDoIt

Views: 976

Keywords: Doctype, HTML5, HTML Tutorials

Id: G1MOlh5uJYE

Length: 4min 41sec (281 seconds)

Published: Sun Aug 22 2021