Transparent Dropdown Menu in HTML and CSS (Hindi)

แชร์
ฝัง
  • เผยแพร่เมื่อ 7 ก.ย. 2024
  • In this video, you will learn How to Create Transparent Drop Down Navigation Menu with CSS and HTML in Hindi.
    The transparent drop-down menu is perfect for a website.
    I used pure CSS and HTML for Drop down navigation menu with full explanation line by line.
    ~-~~-~~~-~~-~
    Please watch: "Responsive Image Slider | HTML & CSS"
    • Responsive Image Slide...
    ~-~~-~~~-~~-~

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

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

    I am working as a Ui Ux Developer since 2018 but never understood among all related videos from this topic which I have watched but 1 st time I understood how actually it's work thanku sir

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

    One of the best video i would say.. the drop-down menu was the new things and i can now clearly understand....🙏

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

    you don't even know how much you help me. THANKS AL:OT

  • @user-dj3cy2sn7g
    @user-dj3cy2sn7g 2 ปีที่แล้ว

    बहुत बढ़िया

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

    I can't understand your language but your codes is so useful to me, thanks bro! I'll support your channel

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

      Thanks for your appreciation

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

    thank u so much sir for this video ,it helped a lot to clear my concepts

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

    I'm from Bangladesh bro u tech very good and too much easy method

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

    অনেক সুন্দর

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

    very nice

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

    Ur video is so informative for me

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

    Thank you ♥♥♥

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

    Very nice explanation❤️

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

    You have guided to me very nice

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

      Thanks keep supporting webdev

  • @AnkitYadav-zw2ww
    @AnkitYadav-zw2ww 3 ปีที่แล้ว

    Very informative video.

  • @ayushsingh-ck7jo
    @ayushsingh-ck7jo 5 ปีที่แล้ว +1

    Thank so much sir
    Sir please help I want to know the meaning of CSS tags.. make video on it.

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

    In a sublime text 3 editor is allowed html code is working properly but css can't working ... I reset all the settings but nothing working properly how can you please explain what's this problem
    And otherwise this is problem it internet explorer or. Other ??????

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

    Vai, Excellent teaching system I really love this ❤️

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

      Thanks

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

      @@webdev07 In a sublime text 3 editor is allowed html code is working properly but css can't working ... I reset all the settings but nothing working properly how can you please explain what's this problem
      And otherwise this is problem it internet explorer or. Other ??????

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

      @@webdev07 Lesson bro I do everything but style.css is not working .... Why it not working I don't know but if you have any suggestions please reply it
      Please 🙏🙏🙏🙏🙏

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

    thanks

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

    Thank u so so so much 😍😍😍😘😘😘😇😇

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

      Thanks for your appreciation

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

    Bhai jaan Boostrap ya phir adobe photoshop se related web designing ki videos agar aap apne channel par more subscriber chahte hain. Boostrap and photoshop are the modern web designing technologies

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

    thank you sir,
    sir,
    next video me ek submenu ka bhi submenu ,bata dijiye sir.

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

    Thankyou :)

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

    So nice

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

    Useful bro

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

    Good Tuto

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

    You are genius.

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

      Thanks for your appreciation

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

      Ek login page banaye jaha login pe click karne k bad ek or page display ho. Or thora explain karna plz.

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

    thank u so much for help

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

    Thanks a lot sir 🤓🤓

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

      Thanks for your appreciation

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

    CSS FILE
    body{
    margin: 0;
    padding: 0;
    font-family: 'lato' , sans-serif;
    font-size: 16px;
    background-image: url(img/1.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 100vh;
    }
    .nav{
    width: 100%;
    background-color: rgba(450,0,60,0.8);
    color: #fff;
    }
    .menu {
    line-height: 45px;
    font-weight: 700px;
    text-transform: uppercase;
    }
    .nav ul{
    list-style-type: none;
    margin: 0;
    padding: 0;
    }
    .nav .menu .menu_item{
    display: inline-block;
    position: relative;
    }
    .nav .menu .menu_item a{
    padding: 12px 24px;
    cursor: pointer;
    text-decoration: none;
    color: #fff;
    display: block;
    }
    .submenu{
    text-transform: none;
    display: none;
    position: absolute;
    width: 220px ;
    background-color: rgba(0,0,0,0.4);
    }
    .menu_item:hover .submenu{
    display: block;
    }
    .submenu_item{
    border-left: 4px solid transparent;
    }
    .submenu_item:hover{
    background-color: rgba(0,0,0,0.9);
    border-left: 4px solid rgba(450,0,60,0.8);
    }
    .menu_item:hover{
    background-color: rgba(0,0,0,0.9);
    }

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

    Lesson bro I do everything but style.css is not working .... Why it not working I don't know but if you have any suggestions please reply it

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

    usefull bro tq

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

    nice tutorial

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

      Thanks for your appreciation

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

    thankyou sir

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

    Yes sir can you explain me
    ???

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

    How you create a red transparent nav bar please told me, I tried but I failed to create red or another colour transparent navbar.

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

      Msg me on instagram i will solve your problem

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

    how to fit background image?

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

    sir can you guide me how you write structure of html without typing? means i am asking which button you press?

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

    Font family se kya hota he?

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

    Can you please reply ???????

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

    Sir Menu pe lekar jaata hu mouse pointer ko tb tk submenu show krta h. Fir submenu me leke jaata pointer ko toh hatt jata h. Aisa q?

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

    Sir

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

    somebody plz explain me how to write in multiple lines at once??

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

    Dear Sir kya yah menu Responsive hai

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

    I am your numb1 fan... But this isn't working in chrome

  • @user-dj3cy2sn7g
    @user-dj3cy2sn7g 2 ปีที่แล้ว

    सर हिन्दी होम पेज पर एक वीडियो बनाने की कृपा करें

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

    This is responsive menu or not

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

    Meta kya hota h
    Meta utf-8?

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

    Bhai isko responsive kaise kare pls batao

  • @PradeepSharma-wd3zl
    @PradeepSharma-wd3zl 4 ปีที่แล้ว

    . submenu ko 220px width kiyo diya hai or sir Kabhi Kabhi float ka use Nahi karte ho or apne aap hi left show karta ha wo kaise

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

      Display inline block se sare nav items ek line me ajate hai

    • @PradeepSharma-wd3zl
      @PradeepSharma-wd3zl 4 ปีที่แล้ว

      @@webdev07 thanks sir

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

    12:45 how u wrote in 3 lines simultaneously ?

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

      Hammad Ranjha by holding control and pressing those 3 lines.

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

    Sir image me url q diya h

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

    Would please post your Source Code ?

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

    Hello sir mujhe website bhawana tha please

  • @vinodyadav-mw9ek
    @vinodyadav-mw9ek 5 ปีที่แล้ว

    very nice pls give me source code link

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

    Aisa banaye jab hum click kare tav o menu khule.

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

    @Web dev sir please reply

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

    Sir aap konsi bhi ek full website banane ki video post karo na

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

      Ki hui hai check my channel's playlist

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

    Sir url q diya h

  • @PradeepSharma-wd3zl
    @PradeepSharma-wd3zl 4 ปีที่แล้ว

    Sir yah batao ki hame ul li ko class de zaruri hai kay

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

    Bhai plzzz mujhe ek website bnado plzzz bro

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

    Flex kya hota h

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

      Is video me fo flex maine use kiya hi nahi

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

      @@webdev07 Mai apni knowledge k liye puch rha hu

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

    Html and css app

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

    Good Tuto