Mastering in CSS3 Box Shadow From Beginner To Expert

แชร์
ฝัง
  • เผยแพร่เมื่อ 18 ต.ค. 2024
  • Enroll My Course : Next Level CSS Animation and Hover Effects
    www.udemy.com/...
    ------------------
    In this tutorial you will Learn How To Create Different CSS Box Shadow Effects Effects in just 8 minutes
    Part 02 : Mastering in CSS3 Box-ShadowFrom Beginner to Expert 02 | Box Shadow and Neumorphism in Html & CSS
    • Mastering in CSS3 Box-...
    Also Watch This: Quick CSS3 Shadow Effects Tutorial For Beginners | CSS Effects
    • Quick CSS3 Shadow Effe...
    ------------------
    Join Our Channel Membership And Get Source Code Everyday
    Join : / @onlinetutorialsyt
    ------------------
    Please LIKE our Facebook page for daily updates...
    / online-tutorial-html-c...

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

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

    There were no timestamps so here you go :
    note the card creation process for all starts from (0:43)
    Box Shadow - 1 : (0:42)
    Box Shadow - 2 : (2:57)
    Box Shadow - 3 : (4:06)
    Box Shadow - 4 : (5:05)
    Box Shadow - 5 : (5:46)
    Box Shadow - 6 : (6:16)
    Box Shadow - 7 : (7:41)

  • @Pankaj-Verma-
    @Pankaj-Verma- 4 ปีที่แล้ว +3

    One of the greatest mind of CSS on youtube.
    Thanks. You are an inspiration to many.

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

    2:12 shadow 1
    2:56 shadow 2
    4:02 shadow 3
    5:02 shadow 4
    5:48 shadow 5
    6:14 shadow 6
    7:14 shadow 7
    (◍•ᴗ•◍)

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

    In all this time, from May, i was a begginer, and your tutorial, makes me to learn so fast....i will find a better work thanks to you.

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

      hey, i have a trouble with sublime.. how do i view my browser whilst i code on sublime just like his'?

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

      @@abeermoeed2256 use preview html extension i think you already get

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

    I prefer short and quick tutorials like this. Makes me less sleepy.

  • @СережаБондаренко-ь6и
    @СережаБондаренко-ь6и 4 ปีที่แล้ว +2

    Ты крут,мужик. У твоей фантазии нет границ. Продолжай в том же духе!!! Успехов тебе

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

    This is the most underrated channel in youTube , carry on .

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

    You are expert sir I really fan for your work.

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

    Your channel best tutorial channel for youtube 😍😘😘

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

    thanks, bro I was searching for this for so long Thank you so much.
    keep it up bro
    ♥♥♥

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

    Can we add shadow to all 3 sides.. ex: shadow on top right and bottom except left side

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

    Can you use something different instead of filter property? it is not very supported. Or is there another way how to create shadow under a div?

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

    Bro, You're something else. Keep up your great work. So talented.

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

    Nailed it man,thank you very much for these types of tutorial

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

    This is too good
    It really helped me

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

      sir one video request plz sir! sir navbar responsive only checkbox use no javascript no jquery only css checkbox.

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

    I love your shadow effects video

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

      :) thanks bro

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

      Sir my real channel name is #uncodeprogrammer can you please promote me means not promote in youtube video means on social media please sir i am also a programmer
      Thanks
      SWARGARAJ
      12 YEAR OLD

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

      And sir please start swift tutorials

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

      Thanks for replying

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

    Always so creative

  • @VisheshRaghav-o2e
    @VisheshRaghav-o2e 2 หลายเดือนก่อน

    Love you brother thanks😅🙏

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

    Thanks very helpful

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

    hi thank you for your help, I tried everything, but the 4th one is not working I don't know why, can you please help me

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

    I am searching for this type of tutorial thank you so much.

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

    CSS king

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

    I wanna give this video a hundred 👍

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

    That was really creative...
    Great!!

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

    What theme do you use?

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

    Why you applied :before on shadow 2 ?

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

    Thanks for all these tricks!

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

    Big thanks man🙏

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

    This is the best live shadow tutorial ever.

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

    Which editor is used in this video?

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

    big tip, grateful for the work

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

    Thankyou

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

    very beautiful! thank u!!!

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

    Love your videos! Keep it going :D

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

    How to create that box and add image and animation to it

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

    Very nice 👍👍👍❤️❤️❤️

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

    Why z-index: -1; no effect if container have background? and need body background only?

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

    This video obligated me to subscribe this chanel, ❤

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

    tum to pro ho

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

    Best!!

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

    than k u

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

    Thanks bro👍

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

    Sir one video requested plz sir! sir navbar responsive only checkbox no JavaScript no jQuery only css checkbox.

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

    WOw, this video is very helpful... i like this channel :)

  • @davidm.8835
    @davidm.8835 3 ปีที่แล้ว

    Very Good!

  • @user-zp1dv4yh5e
    @user-zp1dv4yh5e 4 ปีที่แล้ว

    This is good man , can you make one on CSS Grid?

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

    shadow 4-6-7 is very cool

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

    Hi! Could you make a a tutorial for file input designs?

  • @SurajYadav-pi6xl
    @SurajYadav-pi6xl 3 ปีที่แล้ว

    Thanks bro❤️

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

    Cool, no fuzzy intro chats

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

    Bro, could we have a small tutorial on just transforms and animation properties?

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

    software name please

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

    Plz give course on a working piano

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

    Nice👍

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

    👍🏻 nice

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

    Sir , ur awesome this vid is very helpful grow my business

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

    Siempre agradecido

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

    Thank u🙂.

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

    Whoa, thank you very much 😀

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

    tnx

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

    const Make_some_using => (js) { return tough logic code }??pls
    Because I have to improve in so??

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

    Eres el mejor

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

    Love it

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

    I am the first

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

    👍👍👍

  • @o.voytyn
    @o.voytyn 4 ปีที่แล้ว +1

    filter:blur isn't crossbrowser friendly

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

    Web Design Ki Baat Ho To Sirf *Online Tutorial*

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

    Life saving bro, It's great and neuromorphic shadow is very neat.

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

    Ótimo vídeo parabéns 👌.

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

    Speed is very high

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

    post javascript courses

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

    Hii

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

    The title says CSS3 but you are still using syntax from CSS2 which is :before whereas in CSS3 it is ::before

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

    Hii Sir
    Ek Simpal Contact Us Ka Form Create Kijiye Jo Kaam Bhi Kare
    Form Ko Fill Kar Ke Send Karne Par Jo Form Me Likha Ho Wo Email Pe Aa Jaye
    Please Bro.

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

    Shadow 6 looks like a CPU and shadow 7 looks like a socket

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

    Well done. You explained how does it work box-shadow.

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

    These are some cool effects. box shadow is magic.

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

    what a super tutorial video)))) all info. are simple and clearly described. Thanks a lot for creator

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

    bueno para practicar, felicidades por sus tutoriales

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

    yr smjha dete to jada better hota aap log bas gana lga kar chhod dete ho isse hame samjh nhi ata kuchh

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

    Great tutorial. Horrible music. 😂

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

    Thanks

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

    Sir one video requested plz sir! sir navbar responsive only checkbox no JavaScript no jQuery only css checkbox.