HTML Tutorial for Beginners 13 - The div Tag

แชร์
ฝัง
  • เผยแพร่เมื่อ 19 ต.ค. 2024

ความคิดเห็น • 143

  • @ClaraSais
    @ClaraSais 4 ปีที่แล้ว +168

    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 4 ปีที่แล้ว +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 2 ปีที่แล้ว

      Same here

  • @HarikaShivva
    @HarikaShivva 7 หลายเดือนก่อน +7

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

  • @ellenniles660
    @ellenniles660 3 ปีที่แล้ว +37

    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

    • @sankaranarayanan901
      @sankaranarayanan901 ปีที่แล้ว +2

      Thanks for summarizing it.

    • @ellenniles660
      @ellenniles660 ปีที่แล้ว +1

      @@sankaranarayanan901 Glad you found my summary notes helpful 😊

  • @teebz4811
    @teebz4811 2 ปีที่แล้ว +3

    And what's , and then used for?

  • @justchris846
    @justchris846 8 ปีที่แล้ว +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

  • @RameenFallschirmjager
    @RameenFallschirmjager 4 ปีที่แล้ว +15

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

  • @xigong3009
    @xigong3009 2 ปีที่แล้ว +7

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

  • @pink221
    @pink221 2 ปีที่แล้ว +2

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

  • @vaishnavikollimarla6635
    @vaishnavikollimarla6635 6 ปีที่แล้ว +50

    It is good but want to have a look of output

    • @sakthivel-oy4cg
      @sakthivel-oy4cg 5 ปีที่แล้ว +1

      exactly

    • @voronaizlissabona
      @voronaizlissabona 4 ปีที่แล้ว +13

      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.

    • @natureviews-p1j
      @natureviews-p1j 4 ปีที่แล้ว +1

      @@voronaizlissabona That is right.

    • @najda9237
      @najda9237 4 ปีที่แล้ว +1

      I would comment the same.

  • @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 :)

  • @nompumelelongoma5833
    @nompumelelongoma5833 5 ปีที่แล้ว +19

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

    • @anasanam6446
      @anasanam6446 3 ปีที่แล้ว +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

  • @beepboopgpt1439
    @beepboopgpt1439 6 ปีที่แล้ว +7

    Great help to this confusing tag.

  • @okoyeemeka9815
    @okoyeemeka9815 ปีที่แล้ว +1

    Thank you very much. Still watching in 2023

  • @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 4 ปีที่แล้ว

      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.

  • @AlexanderFowles
    @AlexanderFowles 14 วันที่ผ่านมา

    Thank you this video was so useful, I am going to go adjust my code with div tags now.

    • @NetNinja
      @NetNinja  13 วันที่ผ่านมา

      Glad it was helpful! :)

  • @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.

  • @homerthompson6028
    @homerthompson6028 5 ปีที่แล้ว +2

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

  • @michaelmiletich3326
    @michaelmiletich3326 2 ปีที่แล้ว +1

    I needed this!!! Thank you!

  • @amazingproduct5018
    @amazingproduct5018 3 ปีที่แล้ว +1

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

  • @deborshikashyap6745
    @deborshikashyap6745 4 ปีที่แล้ว +7

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

  • @prathish3169
    @prathish3169 10 หลายเดือนก่อน

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

    • @NetNinja
      @NetNinja  10 หลายเดือนก่อน

      Awesome, thanks Prathish!

  • @olanrewajuolawalewilliams1423
    @olanrewajuolawalewilliams1423 3 ปีที่แล้ว

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

  • @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 :)

  • @gavin_almeida
    @gavin_almeida 2 ปีที่แล้ว +1

    This was such a good explanantion! 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.

  • @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

  • @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

  • @spiritualacts6357
    @spiritualacts6357 3 ปีที่แล้ว

    so glad your not using fancy words. now i understand

  • @ClaraSais
    @ClaraSais 4 ปีที่แล้ว +2

    Why and how do you indent code please?

  • @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 5 ปีที่แล้ว

      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

  • @karunapandey555
    @karunapandey555 3 ปีที่แล้ว +1

    Which type of code editor do you use ?
    :)

  • @TheBearCoder
    @TheBearCoder 2 ปีที่แล้ว +1

    Thank you for this amazing video :)

  • @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.

  • @dianaawino
    @dianaawino 2 ปีที่แล้ว +1

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

  • @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?

  • @gioestrada4652
    @gioestrada4652 2 ปีที่แล้ว +1

    Thanks for the tutorial. You explained it well.

  • @xcload-learningofficial9266
    @xcload-learningofficial9266 3 ปีที่แล้ว

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

  • @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

  • @guardian218
    @guardian218 3 ปีที่แล้ว

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

  • @shintarojokagi946
    @shintarojokagi946 4 ปีที่แล้ว +1

    What extension is it that shows what line you selected?

  • @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 6 ปีที่แล้ว +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.

  • @alinaciobotaru7030
    @alinaciobotaru7030 3 ปีที่แล้ว +1

    Thank you! It was useful 👍

  • @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

  • @douggreene9669
    @douggreene9669 3 ปีที่แล้ว +2

    Excellent explanation, thank you!!

  • @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

  • @davidallsopp4030
    @davidallsopp4030 4 ปีที่แล้ว +1

    Excellent video!

  • @TeckbuildsInfotech
    @TeckbuildsInfotech 7 หลายเดือนก่อน +1

    Thank you 🙏

  • @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

  • @theinternet999
    @theinternet999 ปีที่แล้ว

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

  • @gooo1762
    @gooo1762 8 หลายเดือนก่อน +1

    Thanks!

  • @jerrybarr259
    @jerrybarr259 4 ปีที่แล้ว +1

    Great video cheers

  • @fatenissa5189
    @fatenissa5189 6 ปีที่แล้ว +1

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

  • @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.

  • @vipergun1383
    @vipergun1383 4 ปีที่แล้ว

    thats not a good way if u dont show example

  • @chansolkim3609
    @chansolkim3609 3 ปีที่แล้ว

    Thx bro it's help me a lot 🙏🏻

  • @miikoa
    @miikoa 2 ปีที่แล้ว

    very helpful. Thank you

    • @NetNinja
      @NetNinja  2 ปีที่แล้ว

      Thanks Miiko, glad it was helpful!

  • @fritzrojales
    @fritzrojales ปีที่แล้ว

    what app or website do you use to code?

    • @DamianSzajnowski
      @DamianSzajnowski ปีที่แล้ว

      Brackets, watch the playlist in order, he explains that.

    • @fritzrojales
      @fritzrojales ปีที่แล้ว +1

      @@DamianSzajnowski thanks

  • @irvinargon
    @irvinargon 7 ปีที่แล้ว +3

    Great vid

  • @PieterJacob
    @PieterJacob ปีที่แล้ว

    OCD started to kick in at line 47…

  • @someless
    @someless 6 หลายเดือนก่อน

    This man, shouldn't be a teacher😢😢

  • @stigmanmagros4952
    @stigmanmagros4952 5 ปีที่แล้ว

    Where is this html5 course xd

  • @aliaydemir7309
    @aliaydemir7309 2 ปีที่แล้ว

    can someone explane i still dont understand

  • @valencefootball9740
    @valencefootball9740 3 ปีที่แล้ว

    BRACKETS?!

  • @vunderstudios
    @vunderstudios 5 ปีที่แล้ว +1

    thanks

  • @AprilFaith
    @AprilFaith 6 ปีที่แล้ว +1

    thank you!!

  • @cyclicwarrior2570
    @cyclicwarrior2570 6 ปีที่แล้ว

    I will subscribe to the videos sure

  • @boblewis1287
    @boblewis1287 3 ปีที่แล้ว

    TY

  • @mariamzayed91
    @mariamzayed91 5 ปีที่แล้ว +1

    💙💙💙

  • @markton2192
    @markton2192 3 ปีที่แล้ว +1

    What the h my name is div

  • @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.

  • @kristaa8745
    @kristaa8745 5 ปีที่แล้ว +1

    thankyou

  • @dygcchjghcugfh662
    @dygcchjghcugfh662 2 ปีที่แล้ว

    I'm sorry for watching this the intro scary movie

  • @gajularakesh7576
    @gajularakesh7576 3 ปีที่แล้ว

    nothing......

  • @s.padhmapriya_8thwonder_153
    @s.padhmapriya_8thwonder_153 4 ปีที่แล้ว

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

  • @odam2975
    @odam2975 4 ปีที่แล้ว

    #thx

  • @oldguy8177able
    @oldguy8177able 6 ปีที่แล้ว +1

    rubbish

    • @iLoveTurtlesHaha
      @iLoveTurtlesHaha 6 ปีที่แล้ว +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!

  • @EmmainthePNW
    @EmmainthePNW 6 ปีที่แล้ว +1

    Very helpful thank you

  • @marcelo25758
    @marcelo25758 3 ปีที่แล้ว

    Thank you!