CSS Media Queries | Sigma Web Development Course - Tutorial #31

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

ความคิดเห็น • 1.1K

  • @CollegeMaterials-t4d
    @CollegeMaterials-t4d ปีที่แล้ว +104

    6:10 The secret reason why Harry bhai uses 344 is just ki vo aalsi hai aur ye keys pas pas m hai….
    Isley sb time bachao, aur #SigmaBatchOP krdo😂❤

  • @uddhavraj9791
    @uddhavraj9791 ปีที่แล้ว +73

    saari baate ek traf.
    VDO end hone k bd ki jo music hai n. earphones lgaa k VDOs dekhta hu.
    Mzaa a jata hai.. OSM h bhai
    🔥🔥🔥🔥

    • @pratikkumarsingh8114
      @pratikkumarsingh8114 9 หลายเดือนก่อน +1

      maza aa jata hai , fir se energy level high , full of enthusiam!!

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

      Mai fist video se comment talash kr rha ki koi music ke bary me baat kyun nhi kr rha ❤

    • @irfanfani8806
      @irfanfani8806 22 วันที่ผ่านมา

      relatable 😆

    • @NirbhayVats-b3y
      @NirbhayVats-b3y 22 วันที่ผ่านมา

      For Real

  • @Stark7_World
    @Stark7_World ปีที่แล้ว +45

    Congratulations for completing 1 month of #Sigmawebdevelopment course 🎉🎉

  • @VG_2610
    @VG_2610 ปีที่แล้ว +43

    6:13 - Numbers 3 and 4 were close to your hands and henceforth for the height, you typed '344px' and it is the exact opposite for Numbers 2 and 9.

    • @jeeaspirant9697
      @jeeaspirant9697 9 หลายเดือนก่อน +2

      what does the second part mean ?

  • @SayantanOfficial-jq4mo
    @SayantanOfficial-jq4mo ปีที่แล้ว +10

    Best web development course ever on youtube history

  • @cinematiclife5896
    @cinematiclife5896 ปีที่แล้ว +137

    Thanks! harry bhai you are really lord ....Keep this continue .we people are behind you and we will support you till end

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

      where u r from bro

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

      @@Quester2023-xp7rb 2 rs nahi hai, anpad ki aulaad hai kya

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

      ​@@Quester2023-xp7rb bahi ye 2 rupees nahi 2 euro hai

    • @yashtiwari7312
      @yashtiwari7312 ปีที่แล้ว +8

      @@Quester2023-xp7rb gawar 2 euro hai 2 rupay nahi

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

      Jammu & Kashmir India . Abhi Europe mein hu @@elonmusk23213

  • @priyanshutrivedi2357
    @priyanshutrivedi2357 ปีที่แล้ว +21

    ❤Literally... No one can beat harry bhai in the matter of consistency.....
    Posting one video daily for approx 100 days is insane....
    ❤❤❤❤❤

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

    Congratulations to 20k that learners , who're consistent in Sigma Web Development Course. And thank you Harry Sir

  • @codewithrahull9636
    @codewithrahull9636 11 หลายเดือนก่อน +5

    This man could have earned millions of rupees by selling this course, yet he chose to keep it free for us. Harry deserves much respect. 🙌
    #SigmaBatchOP

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

    Aj pura 1 month complete ho gaya 🚀. Harry Bhai thanks a lot. #sigmabatchop

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

    5:45 div.box*3 likhke enter karne se 3 div with class 'box' ban jayenge, alt+shift+down karne ki jarurat nahi

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

      I need bro
      Ye batado k mere laptop me toggle device toolbar nhi aarha h to me kia kru

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

      Alt+z

  • @GAMER-os2jb
    @GAMER-os2jb 11 หลายเดือนก่อน +4

    Guys!! If you are confused to follow this course. I am telling you this type of course is worth it. don't confuse just follow this course.
    Sigma batch OP
    Proud to be Sigma Army.

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

    Thank you Harry Sir for your incredible, free TH-cam content. Your tutorials have been invaluable on my coding journey. Your dedication to teaching is greatly appreciated.

  • @28.kartiksharma18
    @28.kartiksharma18 ปีที่แล้ว +2

    I am following this course and i am learning many things more than my computer teacher

  • @xeno-m1194
    @xeno-m1194 ปีที่แล้ว +24

    Harry bruh ❤❤🎉
    Thank you for your incredible, free TH-cam content. Your tutorials have been invaluable on my coding journey. Your dedication to teaching is greatly appreciated.

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

    Intro is really giving me the vibe!! This course is going to be really great 🗿🗿

  • @omkarsawant9267
    @omkarsawant9267 ปีที่แล้ว +9

    CSS media queries are used to apply different styles to a document based on various characteristics of the device or viewport, such as its width, height, resolution, and other features. Media queries enable you to create responsive designs that adapt to different devices or screen sizes. They are commonly used in conjunction with CSS to implement responsive web design.
    Basic Structure of Media Query:
    @media media-type and (media-feature) {
    /* CSS rules to be applied when the media query conditions are met */
    }
    1.@media: This is the at-rule that defines a media query.
    2.media-type: Specifies the type of media to which the styles apply. Common values include screen (for computer screens), print (for printed pages), and all (for all media types). The screen type is most commonly used for web development.
    3.media-feature: Describes the characteristics of the targeted device or viewport, such as max-width, min-width, orientation, etc..
    Media Query play a crucial role in responsive web design by adapting layouts and styles to provide an optimal user experience across a variety of devices and screen sizes.

  • @aamish.iqbal01
    @aamish.iqbal01 ปีที่แล้ว +8

    Harry, please don't stop giving us quizzes at the end of videos. It helps us challenge ourselves to create something new and increase our knowledge☺☺

  • @abdulsaboor2004.
    @abdulsaboor2004. ปีที่แล้ว +18

    There's a New & easy ways to use Media Queries:
    @media only screen and (width greater than [your size]
    < smaller than [ your size]
    and so on ...
    =

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

      can we put Width and Height together ??

    • @abdulsaboor2004.
      @abdulsaboor2004. ปีที่แล้ว +3

      @@rupesh_vaghmare Yes, you can put width and height together in a media query.
      @media only screen and (width

    • @vaibhav9310
      @vaibhav9310 11 หลายเดือนก่อน

      Thanks bro.. ​@@abdulsaboor2004.

  • @AJSTUDIO07
    @AJSTUDIO07 5 หลายเดือนก่อน

    This guy is a beast, he maintains our energy at high level.

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

    Tutorial 31 done.✅
    SIGMA BATCH OP!

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

    the quality this course carries with itself is uncomaprable

  • @rajgaming6733
    @rajgaming6733 10 หลายเดือนก่อน +5

    Is flex box ne saari CSS rok rakhi hai😂😂😂

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

    10:58 bhaii Ghar mat ana. Playlist abhi checkout karke save Kar raha hu.
    Btw love your work and dedication man.

  • @krishna290gamer2
    @krishna290gamer2 ปีที่แล้ว +198

    Pin karoge to aapne gaaon aur tau ki zamin aapke naam kar dunga

  • @Ashish...114
    @Ashish...114 ปีที่แล้ว +2

    ab apke har logic ko decode krne k liye hi to yaha aaya hoon & by the time we will know the logic behind 344px 😇❤️
    #SigmaBatchOp

    • @SHASHANKMISHRA-o9r
      @SHASHANKMISHRA-o9r ปีที่แล้ว +1

      I also not know the logic he often used 144, 344 px.

    • @Ashish...114
      @Ashish...114 ปีที่แล้ว

      @@SHASHANKMISHRA-o9r same here 🤣

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

    Salute to your consistency ❤🙏

  • @MuskanShaikh-mg9sb
    @MuskanShaikh-mg9sb 11 หลายเดือนก่อน +2

    Absolutely great course given free by harry bhai..... Thank you harry bhai 😊

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

    harry bhai, left side se folder wali side hata lia karo vscode mai. Thoda easy ho jata hai view.
    And you are doing a great job. :))
    Also aapki wait kar Raha hu, playlist bookmark karvane ke bahane Milne to aaoge mere ghar😅😂

  • @whitemask-Community
    @whitemask-Community ปีที่แล้ว +2

    [ CSS 2 --> Media Rule ] then in [ CSS 3 --> Media Tool ] ::::: - For the purpose of making responsive Websites, 'Responsive' in the sense of it's ability to adapt according to the different sizes of devices, the website is being accessed through.
    SYNTAX :-
    @media screen and (property : ) { css code }
    @media only screen and (property : ) { css code }
    @media not screen and (property : ){ css code }
    Here,
    property can be (max-width : 12px), (min-width : ), (orientation : )

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

    "EXAMS ARE NEAR"
    "NOTHING IS CLEAR"
    "NO NEED TO FEAR"
    "WHEN HARRY BHAI IS HERE"
    Thanku sir for great explanation
    LOVE FROM NSP BSC CS🎉🎉

  • @dawoodkhokhar612
    @dawoodkhokhar612 5 หลายเดือนก่อน

    Congratulations for completing 1 month of #Sigmawebdevelopment course

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

    thank you so much for such an amazing content ....we really appreciate and respect your efforts😄😄lots of respect and love for you😊

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

    Tutorial 31 done. Sigma Batch OP!!!

  • @starboyZi1
    @starboyZi1 5 หลายเดือนก่อน

    greatest for a reason, cant believe this is free
    thanks dude

    • @starboyZi1
      @starboyZi1 5 หลายเดือนก่อน

      sigma batch OP

  • @rajgaming6733
    @rajgaming6733 10 หลายเดือนก่อน +1

    Hmare ache future ke liye plz aap apni excitement aur consistency bnae rakhe❤😊#sigmabatchop

  • @stutidutta3922
    @stutidutta3922 6 หลายเดือนก่อน +1

    Tutorial 31:done
    Sigma Batch op

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

    Tutorial - 31 Done✅
    #Sigma Batch OP
    Really amazing Course❤‍🔥
    Watching from Nepal
    Lots of Love Harry Bhai 💚

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

    Sir aapki har ek video main mzaa ata hai aap ka pdhane ka tarika hi unique hai

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

    #SigmaBatchOP 🌟🌟🌟🌟🌟This Course Deserve Millions Stars Harry Welldone Brother

  • @sunshine5106
    @sunshine5106 9 หลายเดือนก่อน

    Love absolutely every part from intro till end. Is it just me or does it get difficult to manage listening him, watching the changes and coding it simultaneously . This might be are the only videos I need to slow down the playback speed ;)

  • @Thunder_AB-ss1bj
    @Thunder_AB-ss1bj ปีที่แล้ว +1

    #SigmaBatchOp #HarryBhaiyaOp apko dkh kr humko bhi excitment mil jati hai bhaiya

  • @munnammalik
    @munnammalik 11 หลายเดือนก่อน

    Sigma batch OP
    bhai amazing method of teaching at online platform ❣

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

    Love the way you teach Web development ❤❤

  • @ayushmaanraturi
    @ayushmaanraturi 3 หลายเดือนก่อน

    Tutorial - 31 Done ✅
    #SigmaBatchOP #HarryBhai
    Thank you ❤ Harry bhai for this amazing course

  • @Hafijur0211
    @Hafijur0211 11 หลายเดือนก่อน +2

    🎯 Key Takeaways for quick navigation:
    00:00 📱 *Media queries are essential for responsive web design, adjusting styles based on device characteristics.*
    02:23 📏 *Media queries syntax includes `@media` with optional `only` or `not` keywords, specifying the media type (e.g., screen), and conditions like `max-width`.*
    04:52 🖥️ *Example of a media query: `@media only screen and (max-width: 455px) { ... }`, adjusting styles for screens with a maximum width of 455 pixels.*
    08:13 🔄 *Breakpoints in media queries help customize styles for different device categories, enhancing the responsiveness of the website.*
    09:39 🔄 *Use `orientation` in media queries to targetspecific screen orientations, adjusting styles accordingly (e.g., `landscape` or `portrait`).*
    Made with HARPA AI

  • @ExperimenHub
    @ExperimenHub 8 หลายเดือนก่อน

    SIGMA BATCH OP
    Harry bai kafi Informative course ap ne Upload kia he
    Bari Exitment hoti he ap ka mazaq or course dekh kar

  • @Beauty_salon56
    @Beauty_salon56 2 หลายเดือนก่อน

    Harry bhai , you are really a kind man .

  • @aamish.iqbal01
    @aamish.iqbal01 ปีที่แล้ว +1

    East or West Harry bhai is best 😎
    Proud to be the Student of Sigma Web Development course #SigmaBatchOP
    🔥

  • @captaingaming8850
    @captaingaming8850 2 หลายเดือนก่อน +1

    #Day3 25% completed...now going to get some lunch.

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

    North to South, East to West
    Only and only harry bhai is best
    #codewithharry #sigmabatchop

  • @Muhammadkamran-lp1ig
    @Muhammadkamran-lp1ig 10 หลายเดือนก่อน +2

    Sigma batch is op❤

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

    Thanks Harry Bhai ❤ for giving this quality content for free

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

    Aisi kahani sunaaonga jaise daada ji sunate the poton ko 💀 1:51 by the way harry bhai is my favorite teacher for coding. ❤ #SigmaBatchOP Playlist Link: th-cam.com/play/PLu0W_9lII9agq5TrH9XLIKQvv0iaF2X3w.html&si=fIH-xQla6vMhyS2d

  • @cheryrj8305
    @cheryrj8305 2 หลายเดือนก่อน

    completed one month of sigma web dev course 🎉🥳💖✨

  • @Beauty_salon56
    @Beauty_salon56 2 หลายเดือนก่อน

    May GOD always bless you and keep you happy and successful !

  • @criatvEngineer
    @criatvEngineer 11 หลายเดือนก่อน +1

    FAV NUMBERS OF #HARRYbhai : 45, 56, 23, 78 AND 89 😂😂😂 AREE YRR 12 MISS HO GYA THA :)

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

    Hi sir, thank you for your sigma web development course. I am from Bangladesh. I show you all course. I know hindi but understand hindi. Sir please more use English in your course.

    • @SHASHANKMISHRA-o9r
      @SHASHANKMISHRA-o9r ปีที่แล้ว

      Yes he does, nice to hear that from Bangladesh people are coming. Harry is a nice man.

    • @nivealokhande2153
      @nivealokhande2153 11 หลายเดือนก่อน +1

      abe chup, hindi hi theek hai

  • @movehard1851
    @movehard1851 2 หลายเดือนก่อน +1

    ❤️🙏
    Sigma Batch OP.
    ❤️🙏

  • @damonsalvatore-r2m
    @damonsalvatore-r2m ปีที่แล้ว

    harry bhai sub se phly to apka jo course hy ap koi jis proper nai bata thy or bus ap ikhna start krden thy hu or samjhty kam hu aesa thori learn krwaye jata hai

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

    Sigma batch is all time OP🔥🔥🔥🔥🔥

  • @UsmanKhan-rq1yt
    @UsmanKhan-rq1yt ปีที่แล้ว

    344px isliay k mera bhai genious hone k sath sath boht aalse b hai q k 3 & 4 aaju baaju me he hain...isliay.....love u Harry Bhai from PAKISTAN 😍😍😍🥰🥰🥰

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

    Ye ekdam condition ki trah hai.. if agar ye hua to ye apply higga warna apply nhogga .. that set.❤

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

    Thank you for your incredible, free TH-cam content. Your tutorials have been invaluable on my coding journey. Your dedication to teaching is greatly appreciated.

  • @J.P.EDITING
    @J.P.EDITING 2 หลายเดือนก่อน +1

    sigma batch OP🔥🔥

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

    Sigma Batch OP.

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

    SIGMA BATCH OP......❤

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

    Query got solved in flash of a time. Thank u Harry sir❤

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

    0:38 Sigma Batch OP ❤❤❤❤

  • @Aumchoudhary-ez4rq
    @Aumchoudhary-ez4rq หลายเดือนก่อน

    @media only screen and (max-width: 455px){
    body{}
    .box{}
    }
    @media only screen (orientiation: landscape/potrait){
    .box{
    border : 2px solid purple;
    }
    }

  • @southsponge3216
    @southsponge3216 11 หลายเดือนก่อน +1

    THANK YOU SOO MUCH...I HAD A CLIENT WHO WANTED A RESPONSIVE WEBSITE AND IT WAS DONE BUT WASNT RESPONSIVE AND I STRUGGLED HOURS FIGURING OUT HOW TO MAKE IT RESPONSIVE AND ITS FINALLY PERFECT!!!! THANK YOU SOOOOOO MUCHHHHHHHH, YOURE A LIVE SAVERR.

    • @Sameer-mo7rn
      @Sameer-mo7rn 11 หลายเดือนก่อน

      May i ask how are u getting clients this early? Are you experienced or what?Do tell

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

    6:03 because, 3 and 4 bohot pas hay apasmay, so you use 3 and 4 ❤❤❤❤❤❤❤❤❤❤❤

  • @umairkable
    @umairkable 4 หลายเดือนก่อน

    Hats off to you Harry ! watching from Portugal

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

    Sigma batch op!❤

  • @MSIUser2012
    @MSIUser2012 4 หลายเดือนก่อน

    #SigmaBatchOP
    Best Web Development course and that too, in Hindi. Thank you Harry bhai! Your contributions are priceless.

  • @deepkhatri5648
    @deepkhatri5648 5 หลายเดือนก่อน

    This topic i want .so this time the sigma batch is op man .....😊😊😊

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

    #sigmabatchop
    harry bhai video ke end me hi kuch exercise de diya kro jisse hme bhi or confidence ayega

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

    Thanks bro to us free of cost how to make a website

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

    u r great bhai ......thanks

  • @ShubhVerma-CSE-ENGR
    @ShubhVerma-CSE-ENGR ปีที่แล้ว +1

    Sigma Batch OP❤❤

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

    Sigma batch op Harry bhai ❤❤❤❤❤

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

    Sigma Batch op 🤩🤩🤩🤩 love you harry bhau😇

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

    Juska mujhe tha intejar ❤😂

  • @Android-17
    @Android-17 ปีที่แล้ว +2

    Media query done ✅
    #SigmaBatchOP 🔥

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

    Thanks Harry bhai❤

  • @premkrrajbhar
    @premkrrajbhar 4 หลายเดือนก่อน

    thank you harry sir, your notes is valuable on your blog website

  • @KevinLevin-gt5fg
    @KevinLevin-gt5fg ปีที่แล้ว

    any number multiplied by 9 will always result in a number whose digits add up to 9. 6:13

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

    Thanks Harry For This Wonderful Playlist In Free With Op Qaulity And Qauntity of Videos

  • @prohegde006
    @prohegde006 4 หลายเดือนก่อน +1

    Sigma Batch OP
    Harry Bhai OP

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

    0:44 Sigma batch op

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

    Sigma Batch OP ❤‍🔥

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

    Sigmaa batch always op❤❤🎉🎉🎉🎉🎉

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

    Love you harry vhai...please javascript ki course upload do🥰

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

    Sigma batch OP.
    Jai ho Harry bhai ❤

  • @Saitama-g8g
    @Saitama-g8g 22 วันที่ผ่านมา

    this man is LIT ❤‍🔥🔥

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

    Loving this course❤

  • @fizzz0214
    @fizzz0214 11 หลายเดือนก่อน +1

    Great Video I am waiting a lot for #media qouries

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

    Awesome video😎😎👍👍

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

    lesson toh bohot accha dete ho bhai but thoda jaldi video upload karo bcz i already completed lat 31 videos & now i'm waiting for next video.........😑😑😑😑😑😑

  • @Engineering_Unlocked
    @Engineering_Unlocked 9 หลายเดือนก่อน

    thnx bhaiya :)
    completed on 29/2/24