HTML & CSS Crash Course Tutorial #5 - CSS Classes & Selectors

Поделиться
HTML-код
  • Опубликовано: 24 янв 2025

Комментарии • 139

  • @legendaryknight6462
    @legendaryknight6462 4 года назад +91

    I don't know what to say, dear Shaun, I just can say how you explain is the most understandable and simple way of teaching materials in whole earth about the subjects you are teaching. Your voice is also amazing. Every time I watch your tutorials, I would wish if university professors who think are so awesome with their terrible way of teaching materials must come and learn from you how to teach something in an awesome way as you do. Thank you so much 🐱‍👤💖.

    • @NetNinja
      @NetNinja  4 года назад +20

      Thank you! 😃

    • @noumanejaz9657
      @noumanejaz9657 3 года назад +3

      Agreed to your point such a nice explainer teacher no words to explain the teaching methods of your you are totally doing an amazing job Sir.Sir you are great

    • @augustineojeka3878
      @augustineojeka3878 Год назад +1

      This man of a teacher is something else. Since I found his videos, I cannot think of another. How I wish it is possible for him to handle all the subjects of learning in every field of study.

    • @Vibeistic
      @Vibeistic 9 месяцев назад

      Marry Him :)

  • @neaadi2566
    @neaadi2566 2 года назад +8

    I can't believe that this is for free. You're explaining so understandable with a calm voice.
    Keep up the good worrk!
    Thank you.

  • @fortunemxoza3113
    @fortunemxoza3113 3 года назад +5

    I tend to abstain from commenting on RUclips videos but I just had to today, your videos are so amazing and extremely helpful. Exactly what I needed to get back to coding. I started learning in March this year but I've been incredibly inconsistent and so lost. Fortunately a friend of mine recommended this channel and I'm very grateful to him. Keep up the good work!

  • @ItsJustFil
    @ItsJustFil 5 лет назад +14

    You videos go into so much more depth than a lot of other out here. Can't wait to finish this playlist to get on to your other ones!

  • @rakibul1721
    @rakibul1721 3 года назад +5

    You are a saviour man. Your teaching style is very unique and easy to grasp. I have a request though, please add an exercise/assignment at the end of the video. This would increase our understanding and help us to apply what we learn.

  • @acquij
    @acquij Год назад +1

    This whole series just threads the needle so well between thorough explanation and tight pacing; quite excellent.

    • @NetNinja
      @NetNinja  Год назад

      Thank you! :) that means a lot

  • @helendarden1669
    @helendarden1669 4 года назад +4

    This guy is awesome!! I am new to HTML and CSS and have been stumped a few styling issues and linking them to HTML and this guy answered my questions within minutes. Very clear and easy to follow instructions! Thank you!

  • @dogood8661
    @dogood8661 5 лет назад +57

    Shaun I am a big fan of your teaching style. I have one request please make a complete course on nodejs and release it on your udemy a/c. I will be happy to pay as along it is complete. Thanks for being such a great teacher 😀

    • @radu9150
      @radu9150 5 лет назад +2

      agreed!! :D

    • @mickyman753
      @mickyman753 2 года назад

      Would really love a nodejs course @Shaun

  • @frewnegash4738
    @frewnegash4738 4 года назад +1

    This tutorial is so comprehensive that you could find so many critical details. You would get much more in this tutorial than some other vast and paid for courses.

  • @chenqu773
    @chenqu773 3 года назад +2

    I really like EVERY SECOND of your tutorials. The best experience, is always the facinating accent !

  • @nsiepmann
    @nsiepmann 2 года назад +4

    This course is EXACTLY what I need right now - very clear and accessible! Thank you!

    • @NetNinja
      @NetNinja  2 года назад

      You're very welcome :) hope it's helpful!

  • @amnafaiyaz3296
    @amnafaiyaz3296 Год назад

    For a beginner in web design, I highly highly Thank You! The instructional video I watched (3hrs 45mins) confused me more than anything.
    But your videos are simplified in the perfect manner that I’m learning more from you than my actual teacher. THANK YOU SO MUCH!

    • @NetNinja
      @NetNinja  Год назад

      Great to hear! :) thanks for watching

  • @Shane587
    @Shane587 3 года назад

    I honestly never thought myself capable of any measure of mastery over something like this and well you proved me wrong with these pellucid tutorials. Can’t thank you enough for all I’ve learned man.

  • @ClaraSais
    @ClaraSais 4 года назад +7

    Brilliant! Makes my understanding so much better. Reminds me almost of a pizza sliced up with different toppings!

  • @ahmadalharbi9097
    @ahmadalharbi9097 5 лет назад +9

    Thank you Mr ninja , I really enjoyed watching this course , I already bought your javascript course on Udemy , Looking forward to seeing your next videos

    • @NetNinja
      @NetNinja  5 лет назад +2

      Awesome and thank you, hope you enjoy the course 😊😊

  • @dawgz6055
    @dawgz6055 Год назад

    damn man every time I watch a other coding tutorial on the topic that you didn't cover i just miss your voice.. been watching you for 6 years and tho you may not realize it GOD knows how much am extremely thankful to you

  • @dekio9245
    @dekio9245 2 года назад +2

    Im a future EE but in my first year I actually do WebDev. I need to make a site for the next week about one of my passions and this crash course is really helping me out! Next week I'll update on how I did. Thanks for letting this good info be free for everyone!

    • @werkatfischer3183
      @werkatfischer3183 Год назад

      no update :p

    • @dekio9245
      @dekio9245 Год назад

      @@werkatfischer3183 Dang,well it went really well, not only that but now I got into my second year!

  • @songwright
    @songwright 5 лет назад +1

    I'm just clarifying for myself when I look at time 11:00, you make a distinction about the use of a space between "div" and ".error." With a space, the style applies to any descendant in a div with the .error class in the index.html. Without a space, the style is ONLY for a div with the .error class, not the descendants.

  • @adeyeyeopeyemi5304
    @adeyeyeopeyemi5304 2 года назад

    Hiiiiiiiiii!
    It's been a while since you uploaded this video but I'm just getting it and I'm really glad I did!
    It's been a wonderbubble guide for me and I can't express my gratitude enough.
    I don't normally comment on YT videos but yours is fantastic!
    Keep up the good work sir.🤝🏾

  • @gameknightplayz
    @gameknightplayz Год назад

    I like the way you teach there are a lot of coding teachers on youtube that are really hard to understand but I see that you put effort in what you do thank you

    • @NetNinja
      @NetNinja  Год назад

      I appreciate that! :) thank you

  • @piotrrodzen772
    @piotrrodzen772 3 года назад

    You're the boss. Your channel is pretty much all I need to learn about web developing

  • @TheSoftwareServices
    @TheSoftwareServices 4 года назад

    25:35 Yeah rightly said Shaun, thats the way to learn the things ! love your teachings shaun, may god bless you nd your family always...tons of tq

  • @aiyushg1769
    @aiyushg1769 3 года назад

    The people that disliked must have been testing in Internet Explorer or don't have CSS.exe installed jkjkjk. Great video as usual!

  • @egbesampson3568
    @egbesampson3568 Год назад +1

    this is really helpful net ninja thanks a lot

    • @NetNinja
      @NetNinja  Год назад +1

      No probs! Thanks for watching :)

  • @Shakeel714
    @Shakeel714 4 года назад

    Serious sharing of web dev knowledge for serious learners of web dev!

  • @joneljong4591
    @joneljong4591 2 года назад

    I really appreciate you! I'm learning quickly in my 2 days of exploring Front-end with u! 🔥

  • @AbdullahAfzal-xq7kl
    @AbdullahAfzal-xq7kl 8 месяцев назад

    VERY AMAZING LECTURES FOR THE BIGGNERS
    I AM VERY THANKS TO YOU THAT YOU CAN PROVIDE THIS SERVICE ON RUclips WITHOUT ANY PAYMENT😎😎😍😇

  • @mferreira1231
    @mferreira1231 2 года назад

    I'm leraning so much in a spectacular way. Thank you for this content, it is indeed my first steps in my frontend journey!

    • @NetNinja
      @NetNinja  2 года назад +1

      You're welcome Miguel!

  • @yinonb172
    @yinonb172 3 года назад

    Best HTML & CSS Tutorial, explanations are greats and brights.

  • @ch4dix
    @ch4dix 10 месяцев назад

    Wow. I haven't used HTML extensively since 2007 and the attribute selector is news to me. 🤯

  • @herbertsivanda389
    @herbertsivanda389 3 года назад

    Thank you Shaun your tutorials well structure, well presented ease to follow. Its been 3 day now on your training

  • @02f41a0526
    @02f41a0526 5 лет назад

    Shaun,ur videos are really awesome and helpful,ur teaching style is marvelous,am big fan of u.. great thanks for sharing the videos..

  • @premsainoolu8290
    @premsainoolu8290 3 года назад

    Ninja .thanks for explaining in a easily and outstanding way 👌. Love from india

  • @dudem5447
    @dudem5447 5 лет назад +1

    Thank you very much Mr. Ninja for everything you do!. I have bought your javascript course in Udemy and i will be taking it in the next days. Cheers!

    • @NetNinja
      @NetNinja  5 лет назад +2

      Awesome! Thank you so much 😊 Hope you enjoy it 😊😊

  • @gokulpadmakumar564
    @gokulpadmakumar564 2 года назад

    Excellent sir... You are the best ❤️ got to know lot of stuffs I missed

  • @ridl27
    @ridl27 5 лет назад +11

    Hey Shaun, you forgot to attach a link to the article)
    and thank you.

    • @NetNinja
      @NetNinja  5 лет назад +6

      Oops. Thanks, I added in a link now to more info about the cascade!

  • @Furryfriendsvlogg0
    @Furryfriendsvlogg0 2 года назад +1

    Good explaning. How its possible that I have to make sometimes a new file to connect the HTML file? I have it sometimes connected but the CSS don't work together with the HTML. How is that possible? Thanks

  • @calebruesch291
    @calebruesch291 5 лет назад +1

    You make this so easy to understand! Thanks!

  • @adangaraibrahim5862
    @adangaraibrahim5862 3 года назад

    I wonder why those 4 dislikers disliked this.
    Shaun's so incredible!! ❤️❤️

  • @graceyjoseph
    @graceyjoseph 2 года назад

    I watched a lot of tutorials about html and css which were hard to follow for me. Finally I got to your tutorial from my son which I loved and it is so simple to follow #babysteps. Thanks a lot for the great content and can't wait to watch and learn more.

  • @bazbaz7122
    @bazbaz7122 5 лет назад +1

    Thank you, sensei! Really enjoyed watching and learning.

  • @tobyroy336
    @tobyroy336 3 года назад

    how did I not know the difference between div.toby and div .toby? Maybe it's because Toby is a Div. Thank you. You continue to enlighten me sensei.awesome

  • @matteobarbieri2989
    @matteobarbieri2989 5 лет назад +1

    "...terribly original..."
    you are the best!

  • @agentsmith8434
    @agentsmith8434 3 года назад

    This guy is godlike!🦾

  • @flifluflofli
    @flifluflofli 2 года назад

    I undertand that you wanted to do a new version because HTML and CSS do change overtime I definitely notice

  • @strangerinyourchair
    @strangerinyourchair 4 года назад +1

    Would have been cool if you showed us the "pdf" image trick! 16:42
    Get what you mean but not sure how to visual it

  • @MrVipulLal
    @MrVipulLal 4 года назад

    Very clearly explained. Many thanks for the video 🙏

  • @indianpoliticalsystem1949
    @indianpoliticalsystem1949 2 года назад +1

    Good course for beginners!!!

    • @NetNinja
      @NetNinja  2 года назад +1

      Glad you think so! :)

    • @indianpoliticalsystem1949
      @indianpoliticalsystem1949 2 года назад +1

      @@NetNinja Please continue this process this will help many people like me!!

  • @Mythri333
    @Mythri333 Год назад

    Superrr .. thank you so much 😊

  • @miriammiriamxoxo
    @miriammiriamxoxo 5 лет назад

    Awesome, very logical, it all makes sense. I like it

  • @LinuxMember
    @LinuxMember 3 года назад

    Thanks Shaun, I think same like @ahmedali: I don't know what to say, dear Shaun, I just can say how you explain is the most understandable and simple way of teaching materials in whole earth about the subjects you are teaching. Your voice is also amazing. Every time I watch your tutorials, I would wish if university professors who think are so awesome with their terrible way of teaching materials must come and learn from you how to teach something in an awesome way as you do. Thank you so much 🐱‍👤💖.

  • @FordellCastleGaming
    @FordellCastleGaming 2 года назад +1

    I took a college course covering the same material about 14 years ago, and it wasn't taught as well, as thorough, and I am learning a host of new things. Excellent class. Crazy we lost 1/3 of the people from Tutorial 1 to here.

    • @nidzeksmocni659
      @nidzeksmocni659 2 года назад +1

      True. This guy is a life saver. Not many people are willing to keep up grinding. I am willing to improve and extremely motivated. I quit html and css 3 years ago, and now i am back at it at the age of 19. There's no quitting now. Hopefully, I'll make it! I've realized that it's only possible to be good at sth if there's passion for what you do. There's no point in thinking about money.

    • @triducal
      @triducal Год назад

      @@nidzeksmocni659usually the first year of learning is what really gets me. It never seems like you're making any progress, but with consistency and time it starts to come alot quicker.

  • @franzliszt3873
    @franzliszt3873 5 лет назад

    Thanks for all your tutorials!! it has been a big help so far :)

  • @ravichopra2384
    @ravichopra2384 2 года назад

    very helpful and simple man.. i tNice tutorialnk i'm gonna see all your videos

    • @NetNinja
      @NetNinja  2 года назад

      Awesome, thank you Ravi!

  • @janmichaelmatias9522
    @janmichaelmatias9522 Год назад

    Hi Shaun, I am really amazed on how you explain things very clearly. Thank you so much for this. I'd like to ask if you have updated tutorial of react native in your udemy account?

  • @tsdineshjai8565
    @tsdineshjai8565 4 года назад

    Shaun kindly do a complete course on React.js and node.js and please put it up on Udemy. I bought your modern Javascript course on Udemy and i must say i have thoroughly enjoyed it . Your way of teaching is really good !

    • @mohammedyusuf3888
      @mohammedyusuf3888 3 года назад

      you find any alternatives for react.js and his teaching style?

    • @tsdineshjai8565
      @tsdineshjai8565 3 года назад

      @@mohammedyusuf3888 No ! i got a book and have gone through it.

  • @nidzeksmocni659
    @nidzeksmocni659 2 года назад

    Thank you mate! You're a legend!

  • @Palaan92
    @Palaan92 2 года назад +1

    Thank you ☺️

  • @harryflim
    @harryflim 5 лет назад +4

    Dude plz update the nodeJS playlist i am eagerly waiting

  • @benhurcis7407
    @benhurcis7407 5 лет назад

    Thank you!! I understood very well

  • @hasagreenlaser4229
    @hasagreenlaser4229 4 года назад +2

    When adding content, for example "lorem", this often doesn't create a new line in VSCode and I'm forever scrolling across and pressing enter to make it easier for me to read and navigate around. Your content does this automatically. Are you using an extension for this?

    • @ricardopassos1180
      @ricardopassos1180 4 года назад +1

      It's called "word wrap". Look for a gear icon and click on it (it's in the lower left corner). Then settings. A new tab will open and a search bar will appear. Search for "word wrap" and activate it.

    • @vishnuprasadh7692
      @vishnuprasadh7692 4 года назад

      Use Shift+Alt+F to reflow the text

  • @raymondmichael4987
    @raymondmichael4987 5 лет назад +9

    Hahahahahah 🤣🤣; your fans have exploded with "nodejs request".
    Keep up the good work, remember to take good nap "always it's a good idea"
    Greetings from Tanzania 🇹🇿

  • @tn9753
    @tn9753 4 года назад

    Great lesson.

  • @doha.saqlain
    @doha.saqlain 4 года назад

    Thank you you are very good in explaining can you pls give us advance HTML CSS JS courses please

  • @Piston1776
    @Piston1776 3 года назад +1

    If anyone here doesn't know how to generate random text type the word "lorem" in vs code you should see
    the same word in blue below the word you typed press enter or tab

  • @Prosper147
    @Prosper147 Год назад

    Please where’s the link he was gonna leave for more clarifications on selectors specificity?

  • @andrewabraham4197
    @andrewabraham4197 3 года назад

    Hello Mr.Shaun, I love the way you make videos about HTML and CSS for beginners, but I dont understand one thing.
    If u want to make the p tag and error tag different then, do we have to make tag seperately in styles.css? or we can make them in one tag itself?

  • @astrix8812
    @astrix8812 5 лет назад

    You are my GURU!

  • @system7962
    @system7962 3 года назад

    at 9:20 he uses "lorem" but when i use it, all the text goes in a single line, many columns are formed. how do i set the column number so that the 'lorem' text can be a paragraph & not a very long single line? if anybody knows, please help i cant find a solution. @thenetninja

    • @majeed_yass
      @majeed_yass 2 года назад

      8 months in.. you found a way did you? 😅

  • @jareldrizzy6721
    @jareldrizzy6721 2 года назад

    please i want to know how to give multiple h1 tags in a code different fonts,colors as well as the p tags in that code....please help

  • @pierrel.3937
    @pierrel.3937 3 года назад

    short question, what would be the purpose of using #div#content for selecting the div with the id content since the id has to be unique ? sorry if it is a silly question

  • @valentineuche2342
    @valentineuche2342 2 года назад

    is it possible to use asterisk * in place of "placeholder" ?

  • @VINEETHDMONSTER
    @VINEETHDMONSTER 3 года назад

    Thanks a lot

  • @BuilsXshorts
    @BuilsXshorts 5 лет назад +1

    Wow,
    there are too may selectors, and i'm learning it too fast from "Ninja Shaun".
    Thanks

  • @gregmantle7019
    @gregmantle7019 4 года назад +5

    Hi there! Love the tutorials, they are seriously helping so much! I have a question about id tags however. You said they need to be unique and cannot be used again on a different element when using a style sheet however I've put the same id tag on both a tag and and am allowed to style both elements as the same color, one not being indifferent from the other. I guess what I'm asking is for some clarification on your statement there! Just trying to grasp a better understanding, thanks! :)

    • @leodragonheart754
      @leodragonheart754 4 года назад

      Yo, Im just starting on this aswell. are you sure that your h1 is affecting ur p tag? have u tried coloring them different colors? what he means is that if you id both of them "test 1" then whatever u style with id: test 1 will be on both of them. But if you want to only affect the h1 or the p tag then you would have to change ur id or input the tag before the id name.

  • @bowking2708
    @bowking2708 3 года назад

    you are the best

  • @madebytl
    @madebytl 4 года назад

    @Thenetninja Do a video about HTTP please? I don't understand when I use vs code and click live server I don't what does that process mean?

  • @shazaalbeik1373
    @shazaalbeik1373 5 лет назад

    Thank you very much :)

  • @MustafaBirsoz
    @MustafaBirsoz 5 лет назад

    A true Ninja

  • @umbrasyl
    @umbrasyl 11 месяцев назад

    Probably overthinking, but why do we target classes with a dot and not with [class="error"] if it's an attribute? 🤔

  • @dalikey-pew
    @dalikey-pew 3 года назад

    when i press lorem tab it doesnt spread out its all on 1 line?

  • @lokesh61901
    @lokesh61901 5 лет назад

    will be get an Angular JS course ?

  • @chris2199
    @chris2199 4 года назад

    10:02 gotta try on different accents sometimes 🤣

  • @aminmouhamed2502
    @aminmouhamed2502 4 года назад

    the best ninja

  • @ahmedhabeeb2499
    @ahmedhabeeb2499 5 лет назад +1

    Ninja, 😁 thanks
    Habibi please node please 🙏

  • @AprilFaith
    @AprilFaith 5 лет назад

    thank you!!

  • @laurisskraucis2247
    @laurisskraucis2247 4 года назад

    pure gold

  • @chappidinagarjunreddy7816
    @chappidinagarjunreddy7816 29 дней назад

    Hello sir,
    If you don't mind,
    Can you please share the notes for following
    HTML, CSS, Javascript, React JS in front-end.
    In Back-end (JAVA) Servlets/JSP, Spring boot, Hibernate, My SQL Database.
    Gradle, Maven, Docker building tools.

  • @marlowemichaelson1366
    @marlowemichaelson1366 4 года назад

    I feel silly for asking this but can someone clarify for me the difference between "color" and "background" and "background-color"?. Thank you in advance...this should not be as confusing as it seems but I cannot wrap my head around when to use each of them.

  • @zhanjichuang4900
    @zhanjichuang4900 4 года назад

    check developer.mozilla.org/en-US/docs/Web/CSS/CSS_Selectors for more info

  • @Lbmaniak
    @Lbmaniak 5 лет назад

    Thx!

  • @hush8684
    @hush8684 Год назад

    the pink actually killing me but great course
    thanks

  • @kriknosreme1
    @kriknosreme1 Год назад

    Doesn't work for me. please explain.
    div p a{
    color: red
    }

  • @robcurrie1261
    @robcurrie1261 7 месяцев назад

    I like the way you don't show your face.
    Ninjas shouldn't show their faces.

  • @tosifkhan5048
    @tosifkhan5048 5 лет назад +2

    node.js course please

  • @edwardlopez514
    @edwardlopez514 2 года назад

    bless this man's soul I can't believe he gave us this gift for free.

  • @rileyharris5345
    @rileyharris5345 4 года назад

    What is Episoketren System? Does it work? I hear most people improve their soccer skills with it with this popular training program.

  • @pedromalla123
    @pedromalla123 2 года назад

    i learn soft with nobody teacNice tutorialng ...a friend gave the software and i started clicking anytNice tutorialng i see on the software for months

  • @bonjingtv9151
    @bonjingtv9151 9 месяцев назад

    is this shit outdated it fucking attribute selector link is not fucking working for me

  • @mailjjbjb884
    @mailjjbjb884 4 года назад

    Orange