HTML Tutorial for Beginners 13 - The div Tag

Поділитися
Вставка
  • Опубліковано 27 сер 2024

КОМЕНТАРІ • 141

  • @ClaraSais
    @ClaraSais 4 роки тому +164

    That’s great - I’m just learning HTML and CSS, trying to get my head around DIV tags. It’s so much easier for me to learn by visual rather than just reading instructions. Thanks

    • @firsttimegamingfirsttimega428
      @firsttimegamingfirsttimega428 3 роки тому +4

      me 2 mate.

    • @and_still.
      @and_still. 2 роки тому +1

      So where are you now in your journey of learning did you got any job

    • @mrbfortuin
      @mrbfortuin 2 роки тому

      hey i just saw your comment now... how has the coding being going for you after 2yrs?

    • @mrbfortuin
      @mrbfortuin 2 роки тому +1

      hey i just saw your comment now... how has the coding being going for you after 2yrs?

    • @nahomdesta1237
      @nahomdesta1237 Рік тому

      Same here

  • @ellenniles660
    @ellenniles660 3 роки тому +36

    Thank you very much for a quick, yet detailed listing of why div tags matter.
    -Dividing sections for organizational clarity
    -For use in CSS to come
    -Semantics and naming convention separation

  • @HarikaShivva
    @HarikaShivva 5 місяців тому +5

    Wow, i cannot believe a video that is posted 8 years ago is sooo easy to understand and clear, really good explanation ! (2024 btw)

  • @RameenFallschirmjager
    @RameenFallschirmjager 4 роки тому +15

    "I'm here back in the index file exactly where I left it off last time" - a Ninja poem!

  • @teebz4811
    @teebz4811 2 роки тому +3

    And what's , and then used for?

  • @xigong3009
    @xigong3009 2 роки тому +7

    My notes: div creates divisions of the contents in HTML. This will come handy when combined with "class" and "id"

  • @simpsot_
    @simpsot_ 7 років тому +15

    i like how you even go into what keybinds you make...great tutorials man

    • @NetNinja
      @NetNinja  7 років тому +4

      Thanks, glad you like :)

  • @vaishnavikollimarla6635
    @vaishnavikollimarla6635 6 років тому +49

    It is good but want to have a look of output

    • @sakthivel-oy4cg
      @sakthivel-oy4cg 5 років тому +1

      exactly

    • @voronaizlissabona
      @voronaizlissabona 4 роки тому +14

      because on this stage, nothing is visually chaged on the website he is creating. As he said, inserting divs by itself will not produce any visual effect on a website...only adding to it a CSS option will produce an effect so you can see it.

    • @user-jy9tg5lg5n
      @user-jy9tg5lg5n 4 роки тому +1

      @@voronaizlissabona That is right.

    • @najda9237
      @najda9237 4 роки тому +1

      I would comment the same.

  • @pink221
    @pink221 2 роки тому +2

    Thank you Net Ninja! It is refreshing to see a video so clear and straight to the point.

  • @justchris846
    @justchris846 7 років тому +32

    Shawn, Excellent tutorials! If you haven't or haven't considered it, you should do tutorials on languages Such As Java, C++, and C#. as detailed as you get in these web series, you'd undoubtedly amass quite the following for anyone wanting to learn programming. Java would be an excellent place to start. Thanks for these tutorials bro!

    • @rarestaiden185
      @rarestaiden185 5 років тому +3

      spoiler alert he dose

    • @beenmicrophone5817
      @beenmicrophone5817 5 років тому

      @@rarestaiden185 spoiler alert, u smell like farts

    • @Furkanh66
      @Furkanh66 3 роки тому +1

      @@beenmicrophone5817 Spoiler alert, you are toxic

    • @beenmicrophone5817
      @beenmicrophone5817 3 роки тому

      @@Furkanh66 spoiler alert you spoiled ur pants

    • @Furkanh66
      @Furkanh66 3 роки тому +1

      @@rahel7443 spoiler alert: You broke the streak. thank you

  • @beepboopgpt1439
    @beepboopgpt1439 6 років тому +7

    Great help to this confusing tag.

  • @nompumelelongoma5833
    @nompumelelongoma5833 4 роки тому +19

    i love it , but if would've worked better for me if i saw the end results

    • @anasanam6446
      @anasanam6446 2 роки тому +3

      He said there would be no visual effect but it will come in handy when working with CSS and it makes it easier for u to come look at it again

  • @okoyeemeka9815
    @okoyeemeka9815 11 місяців тому +1

    Thank you very much. Still watching in 2023

  • @larryqcumber3705
    @larryqcumber3705 6 років тому +5

    Hi i've been following this toturial and i can easily understand it. Great toturials! Keep it up

  • @effortlesscoding6108
    @effortlesscoding6108 3 роки тому +1

    VERY INFORMATIVE AND EDUCATIONAL. SUBSCRIBED AND WAITING FOR MORE.

  • @bh-doublel1764
    @bh-doublel1764 4 роки тому +3

    Hi I have a very important question : why don't you use , , tags for split up your page in different sections? Does div tag has no semantical meaning?
    ... Thank you for your answer

    • @xfire3778
      @xfire3778 3 роки тому

      BH-DoubleL you’re welcome

    • @Munchkie
      @Munchkie 2 роки тому +1

      You can use that instead of divs. People use divs for grouping content, therefore it's easier to style it because of usage of div tag. I THINK. IM UNSURE. These videos are not explaining at start when to know to use them. I heard its easier but why? I dont know why people use divs instead of semantic tags. BEause semantic tags are more efficient instead of using div's and giving class names. I guess because there are limited semantic tags. so, they use divs as replacement maybe.

  • @amazingproduct5018
    @amazingproduct5018 3 роки тому +1

    Thank bro.This information really helpful ! keep it up man !

  • @jacquelinewalker6357
    @jacquelinewalker6357 2 роки тому

    so glad your not using fancy words. now i understand

  • @gavin_almeida
    @gavin_almeida 2 роки тому +1

    This was such a good explanantion! Thank you!

  • @michaelmiletich3326
    @michaelmiletich3326 2 роки тому +1

    I needed this!!! Thank you!

  • @dianaawino
    @dianaawino 2 роки тому +1

    Thanks so much for this straight forward explanation👌👌💥💥

  • @ClaraSais
    @ClaraSais 4 роки тому +2

    Why and how do you indent code please?

  • @homerthompson6028
    @homerthompson6028 4 роки тому +2

    Hi I'm new to html but... shouldn't the contact info go in the foot instead of the bottom of the body?

  • @olanrewajuolawalewilliams1423
    @olanrewajuolawalewilliams1423 3 роки тому

    You explainedthe $ out of this, been searching for 2days and you broke it down like 1+1 thank you. .

  • @prathish3169
    @prathish3169 8 місяців тому

    Thank you bro im more confused while coming around div but your video Gave me clear and sharp understanding 👏👍

    • @NetNinja
      @NetNinja  8 місяців тому

      Awesome, thanks Prathish!

  • @gioestrada4652
    @gioestrada4652 2 роки тому +1

    Thanks for the tutorial. You explained it well.

  • @douggreene9669
    @douggreene9669 3 роки тому +2

    Excellent explanation, thank you!!

  • @mohamedahmed996
    @mohamedahmed996 2 роки тому

    Have been on the grind for 2 weeks now. I will update you guys periodically to update you on my journey.

  • @TeckbuildsInfotech
    @TeckbuildsInfotech 5 місяців тому +1

    Thank you 🙏

  • @TheBearCoder
    @TheBearCoder 2 роки тому +1

    Thank you for this amazing video :)

  • @deborshikashyap6745
    @deborshikashyap6745 4 роки тому +7

    When u type something it sounds like u r hitting the table

  • @davidallsopp4030
    @davidallsopp4030 4 роки тому +1

    Excellent video!

  • @clueloss5373
    @clueloss5373 5 років тому +2

    very good, Im only 12 and starting out to code thank you alot!

    • @happyemoji6553
      @happyemoji6553 5 років тому

      only 12? are you sure? 12 year olds don't say "I'm only 12" because they don't think they're very young and they don't use comas or punctuation in general.

    • @happyemoji6553
      @happyemoji6553 5 років тому +1

      I'm only 29. How does that sound?

    • @clueloss5373
      @clueloss5373 5 років тому

      13 now

    • @clueloss5373
      @clueloss5373 5 років тому +1

      @@happyemoji6553 They do?

    • @happyemoji6553
      @happyemoji6553 5 років тому +1

      Not Matrix no they don’t

  • @gooo1762
    @gooo1762 6 місяців тому +1

    Thanks!

  • @phillipmakris7345
    @phillipmakris7345 5 років тому +2

    i still dont get divs. They dont effect the structure of the html, they dont style, you can just skip a few lines to show different sections of code.....so why do we need divs?????

    • @PilaPlanet
      @PilaPlanet 5 років тому +7

      Not sure if you know CSS but you can use DIV tags to style a certain portion of your website instead of your whole page. Let's say you have a paragraph on your home page that you want the text to be PURPLE. You will use a DIV with an ID tag to distinguish that specific paragraph without changing all other paragraphs you have. I hope that helps.

    • @williamparrish2436
      @williamparrish2436 3 роки тому +2

      Divs are the most important tag that exist. They are odorless, colorless, nothing but form. But form and structure are all you need. Every other tag is like a div tag but restricted in some way. Divs are free of restriction. Anything you can do with a normal tag, you can do with a div (speaking about block elements, but also inline too). The question you really want to ask is, how do I use divs when building software UIs. And the answer is, since everything in the UI is made of squares. down to the pixel, and divs can be controlled down to the pixel, with divs you can control EVERYTHING you see in the UI. I think because of the history of HTML, CSS, and JS people get confused about the tools of HTML and why they are used. All those other tags that everyone shows you when you first start learning? Use those to build websites that display information. But do you want to create software and just happens to have a UI using HTML, CSS, and JS? Do you want to do full stack JS? Then use divs. That is the difference in the simplest way I can think to describe. All those old tags that everyone drags out and fills videos on are useful for writing and copy creation. But the web has CHANGED. It and the tech that created it can now be used to build software. And using divs, classes, event listeners, and DOM scripting is how that is done.

  • @fft2020
    @fft2020 5 років тому +3

    so... basically the DIV tag has absolutely no purpose except confuse everyone...

    • @mohamedfadaly7223
      @mohamedfadaly7223 5 років тому +2

      Seems it will be useful when including CSS, to avoid confusion of what a certain CSS belongs to, it's better to create groups inside an HTML hence the DIV tag, still learning through too.

    • @mouadouan
      @mouadouan 5 років тому +1

      u ll need divs when it comes to CSS. when u apply some style to a div it affects the whole block, so imagine having some blocks with different styles .. that actually add some structure !
      there's also the Nav tags, check them too :)

  • @shintarojokagi946
    @shintarojokagi946 4 роки тому +1

    What extension is it that shows what line you selected?

  • @alinaciobotaru7030
    @alinaciobotaru7030 2 роки тому +1

    Thank you! It was useful 👍

  • @laurendayan8494
    @laurendayan8494 7 років тому +2

    Why didn't you tab the About Us?

    • @cal9653
      @cal9653 6 років тому +2

      He just didn't realise he hadn't!

    • @iLoveTurtlesHaha
      @iLoveTurtlesHaha 5 років тому +1

      Tab is only for us humans to read code better. The browser doesn't care about this. Like the prev commenter stated, he could have simply missed this.

  • @huzaifamemon9956
    @huzaifamemon9956 6 років тому +1

    what will happen if i didn't give a tag

    • @felixwang9648
      @felixwang9648 6 років тому

      If you dont add a tag but add no css, it wont affect anything

    • @IbnAnwarAli
      @IbnAnwarAli 4 роки тому

      From my practice declaring class and id without div tag worked and usable in css, for example when you declare the class in h1, it still functions as it does with div tag

  • @moorland6735
    @moorland6735 5 років тому +4

    2:41 he didn't indent line 47. The OCD in me is killing me.

    • @ClaraSais
      @ClaraSais 4 роки тому

      Moorland Hi! New to coding, why and how do you apply indents please?

  • @Leyy_Umar
    @Leyy_Umar 4 роки тому

    is using tag is a good practice in html5 beacuse i have heard lot about it and it is not recommended

  • @irvinargon
    @irvinargon 7 років тому +3

    Great vid

  • @karunapandey555
    @karunapandey555 3 роки тому +1

    Which type of code editor do you use ?
    :)

  • @miikoa
    @miikoa Рік тому

    very helpful. Thank you

    • @NetNinja
      @NetNinja  Рік тому

      Thanks Miiko, glad it was helpful!

  • @jerrybarr259
    @jerrybarr259 3 роки тому +1

    Great video cheers

  • @richardbassey4916
    @richardbassey4916 2 роки тому

    I wish I knew that div just meant division. Now it seems a whole lot easier to read code cos I know

  • @TheBlueMahoe
    @TheBlueMahoe 4 роки тому +1

    @netnija, now that i am near the end of the videos ,can you recommend some basic HTML tutorials and exercises I can complete and a few mini projects

  • @marcelo25758
    @marcelo25758 3 роки тому

    Thank you!

  • @theinternet999
    @theinternet999 10 місяців тому

    reLearn html, see u (myself) again in 4 years.

  • @guardian218
    @guardian218 2 роки тому

    Is using the 'div' tag about the same as using the 'section' tag?

  • @thegiverr
    @thegiverr 5 років тому

    What is your recording application? I use OBS Studio and I want to use transition effect like this, from this tab to that tab. My OS is Windows 10

  • @EmmainthePNW
    @EmmainthePNW 6 років тому +1

    Very helpful thank you

  • @chansolkim3609
    @chansolkim3609 3 роки тому

    Thx bro it's help me a lot 🙏🏻

  • @aliaydemir7309
    @aliaydemir7309 2 роки тому

    can someone explane i still dont understand

  • @xcload-learningofficial9266
    @xcload-learningofficial9266 3 роки тому

    I've been coding for about a day & I'm really trying to get average

  • @someless
    @someless 4 місяці тому

    This man, shouldn't be a teacher😢😢

  • @boblewis1287
    @boblewis1287 2 роки тому

    TY

  • @ivanyosifov2629
    @ivanyosifov2629 5 років тому

    Where is the HTML5 course? Can't seem to find it!

    • @juboraj365
      @juboraj365 5 років тому

      With respect please !

  • @hydrusyyen
    @hydrusyyen 4 роки тому +1

    Please show results every changes sir.

  • @vunderstudios
    @vunderstudios 5 років тому +1

    thanks

  • @fatenissa5189
    @fatenissa5189 6 років тому +1

    Can you please add tutorials explaining in it html 5 and css 3
    Thank you alot

  • @AprilFaith
    @AprilFaith 6 років тому +1

    thank you!!

  • @PieterJacob
    @PieterJacob Рік тому

    OCD started to kick in at line 47…

  • @fritzrojales
    @fritzrojales Рік тому

    what app or website do you use to code?

  • @EMR80
    @EMR80 6 років тому

    Is there another reason to use div tags? I read somewhere, you can also use divs to position content as well. That was confusing to me because, I was wondering why is this div nested in side of another div? OMG! Did a Light bulb, just go off in my head? Or some brain cells grow back.

    • @EMR80
      @EMR80 6 років тому

      Can someone Clarify this to me? Layout is so hard for me to understand?

    • @griffinbastion
      @griffinbastion 5 років тому

      @@EMR80 within css you can manipulate the actual look of the website and if you give div an id it will automatically turn all content to that style

  • @mariamzayed91
    @mariamzayed91 5 років тому +1

    💙💙💙

  • @kristaa8745
    @kristaa8745 5 років тому +1

    thankyou

  • @vipergun1383
    @vipergun1383 4 роки тому

    thats not a good way if u dont show example

  • @valencefootball9740
    @valencefootball9740 3 роки тому

    BRACKETS?!

  • @cyclicwarrior2570
    @cyclicwarrior2570 6 років тому

    I will subscribe to the videos sure

  • @stigmanmagros4952
    @stigmanmagros4952 5 років тому

    Where is this html5 course xd

  • @goldie12577
    @goldie12577 4 роки тому

    Great but no output

    • @netskater4454
      @netskater4454 3 роки тому +1

      Output not needed because nothing has changed. Div is used to organized the code so later on, you can choose to style/edit it with CSS.

  • @markton2192
    @markton2192 3 роки тому +1

    What the h my name is div

  • @dygcchjghcugfh662
    @dygcchjghcugfh662 2 роки тому

    I'm sorry for watching this the intro scary movie

  • @odam2975
    @odam2975 4 роки тому

    #thx

  • @gajularakesh7576
    @gajularakesh7576 3 роки тому

    nothing......

  • @s.padhmapriya_8thwonder_153
    @s.padhmapriya_8thwonder_153 3 роки тому

    lots of doubt uncleard, atleast u have to show the output(waste of making this video).please learn to make output mr.youtuber

  • @oldguy8177able
    @oldguy8177able 6 років тому +1

    rubbish

    • @iLoveTurtlesHaha
      @iLoveTurtlesHaha 5 років тому +2

      Your feedback is not very helpful as it gives no basis on what you find wrong. As a person getting into development, you need to be more intelligent than this or you will fail in this industry. No one is able to help you when you cannot form a coherent sentence to express your ideas.

    • @Dailydoseofreddit.
      @Dailydoseofreddit. 4 роки тому

      really? try it making a tutorial and please let me see how good it is by sending it to arav.narula08@gmail.com

  • @matthewp9414
    @matthewp9414 4 роки тому +1

    Thank you!