Div Tag

Kashif Iqbal
A free video tutorial from Kashif Iqbal
Teacher, Blogger, Designer and developer.
4.2 instructor rating • 5 courses • 48,074 students

Learn more from the full course

HTML & CSS Ultimate Course - Build 10 Websites

Build and coding amazing website. Convert any design into HTML & CSS.

18:32:01 of on-demand video • Updated July 2017

  • Code HTML
  • Code CSS
  • Develop any website in HTML & CSS
  • Convert PSD into HTML & CSS
English [Auto] Hello guys what's up. Hope all is well. Thank you for tuning into this video and this video we've been talking about the tax. We will go to a program whatever program you are using you can just go to open and go to your files which I provided in my GO GO TO template and I'll be going to do it with all of those. Oh and same as. And we will see if this has TIV tags. OK. Underskirt tax save and we will change that title to the tags say. So what are the tax tags actually like a continuous and the tags act like content's. So for example if I was attending a site if I go to yahoo dot com and as you can see this Web site is divided into fuse few contenders for example this section here and navigation as you can see this is in a separate container. OK. And this section here. The main section where you can see all these links have a separate section separate container and this one on the on the third one the third line the third row have a separate container. OK. So all the sections are divided into containers. There's a new tag came for div tag and that is section tag. What we will talk about in the next. So I'm covering div tags because people are still using the tags. So what we can do we would go over a document and type. For example let's say this is a container in the main content which will hold everything. So I say give and give and I will close this tag so we can put that comment here. So we know we're actually as you remember we covered the comment tag in the last lecture. So we say this is a container. OK. So we know what we are dealing with. And the co-op is and I say glinting ants. OK. Save. So this is a water main container. So everything we want to put it here of course we're going to put in a body bag. Everything is in the body tags so we put it here everything so we can align this Steve this take this tagging on this container so we can align in the center left or right where we want and what we have. And the next day is for example within this container and we want to have another two containers one is full article and one is for a sidebar. OK. So what we can do is we type and and I can just copy here so I say this is the article or article cantenna. OK. And if I could add here articular container and. Get so so we can do we will have another container here and there actually and that is container as I said. And I say here is can just paste the comment tag. And I say this is the side wall container needs to save some time. And I say sign and contain. And as soon as you can see this is how we laid down a you know me sections are containers for the word content. If you click on this thing and you can see my program if you are using not less Plus it will get the same effect. This is telling me this is the opening tag for this closing tag. So you can see all of this the we know this here is controlling everything inside in it. OK. So if I click here and see this is a sidebar container and this is going to be the article content. Now as you can see this look very messy actually very hard to see which container goes away. So what we can do incoming lectures we will we will talk about how can we lay down this structure so we can understand easily which which type or a list do you know under that tax or let's say if we click here you can see this is a closing tag. And this is the opening tag for this closing tag. So we need to click each time to see the combination you know. So but there is a better way to lay down this. And in the future we will give some classes as well. For example we will talk about class in the future but I can give you a little bit example for example this is a contender is that this is a container. So I say id or class. So let's say glass glass and I say container. OK. Or I can say man container you can give any last name as long as it makes sense. So this is the main container of what it means. This will hold everything. OK we can create more container classes with different names of course inside. Inside this container. So voidable this one here as well. And then we can just give another class here we can say KLAUSE. Hey Artecoll container. OK. So you can see now it makes more sense. OK so this is a man can be known easily as the article can be. OK. So this is how these things work. OK. This is I'll just give you those are the glasses in the future plus. OK. So guys thank you for watching. And if you have any questions or anything just let me know and I will try my best to help you out. Thank you for watching and stay tuned for the next. Thank you.