Login Form in HTML & CSS

Поделиться
HTML-код
  • Опубликовано: 17 июн 2023
  • Login Form in HTML and CSS, Login Page HTML CSS, Login Form using HTML and CSS, Login Form HTML CSS, Login Page HTML CSS, Login Form CSS
    Click For More: / @codehal
    Website:
    codehalweb.com/
    -------------------------------------------------------------------
    Get Source Code from here and support me ❤
    www.buymeacoffee.com/codehalY...
    Get Source Code by PayPal
    ko-fi.com/s/3f87573b63
    🔔 Subscribe Now!
    / @codehal
    Related Videos:
    Animated Login Form using HTML and CSS Only
    • Animated Login Form us...
    How To Make A Website With Login And Register | HTML CSS & Javascript
    • How To Make A Website ...
    How To Create A Website With Login And Register | HTML & CSS & Javascript
    • How To Create A Websit...
    How To Create A Website With Login | HTML & CSS
    • How To Create A Websit...
    Download Image & Start Project From Scratch:
    drive.google.com/file/d/1APE2...
    Icons:
    boxicons.com/
    Image Sources:
    Image created by pikisuperstar
    www.freepik.com/free-vector/l...
    Codehal
    -------------------------------------------------------------------
    #css #cssanimation #csseffect #codehal
    -------------------------------------------------------------------
    Disclaimer video is for educational purpose only. Copyright Disclaimer Under Section 107 of the Copyright Act 1976, allowance is made for "fair use" for purposes such as criticism, comment, news reporting, teaching, scholarship, and research. Fair use is a use permitted by copyright statute that might otherwise be infringing. Non-profit, educational or personal use tips the balance in favor of fair use.

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

  • @catherinesalazar2113
    @catherinesalazar2113 7 месяцев назад +106

    Everything about this video was BEAUTIFUL! the color-elements harmony, music, the neat code and the 'simple' yet spectacular final result. Thank you!

  • @alexandramoura2918
    @alexandramoura2918 6 месяцев назад +21

    I'm so in love with possibilities of this design, the code is simple, the visuals are minimalist yet so beautiful, thank you fot this!!

  • @jasminnieoo
    @jasminnieoo 5 месяцев назад +8

    i much appreciate you beginning with bright colors when positioning + sizing, it helps me understand how to put things in place

  • @lehaswinipalla3365
    @lehaswinipalla3365 9 месяцев назад +20

    Thank you so much! I didn't know anything about css but i sure learnt a lot from this!

  • @user-ul6ee2nj5d
    @user-ul6ee2nj5d 4 месяца назад +3

    I could really use the practice with my HTML and CSS, your video was perfect! Thanks so much man keep up the good work!

  • @BynxBS
    @BynxBS 9 месяцев назад +21

    I am really going to say thank you! Thank you for this immense help!

  • @efraimelkan5794
    @efraimelkan5794 5 месяцев назад +7

    Professional work. I like how you help us which div is which one by giving each a different color.

  • @ilhan537
    @ilhan537 9 месяцев назад +40

    Your coding style is amazing.After watching your videos i have also started web designing...

    • @DaniellaB.
      @DaniellaB. 22 дня назад +1

      Hi, how has it been going for u?

    • @t2hasnain
      @t2hasnain 15 дней назад

      @@DaniellaB. cffvnfvnvn c

  • @playerdani327
    @playerdani327 7 месяцев назад +9

    Looks perfect and a great tutorial, thank you👌🏼✌🏼

  • @bigarshiev2195
    @bigarshiev2195 6 месяцев назад +3

    This was very good I’ve been going through w3schools but they had nothing regarding designing the login form to this level

  • @muppasaikrishna9403
    @muppasaikrishna9403 8 месяцев назад +13

    I am really going to say thank you! It's simple and useful

  • @mitikouman7581
    @mitikouman7581 6 месяцев назад +3

    I am really grateful to you
    I learned many things ❤❤

  • @FearAwaits
    @FearAwaits 8 месяцев назад +2

    Thank you sir! More tutorial please❤

  • @nglme
    @nglme 10 месяцев назад +11

    Wonderful man! Loved it.

  • @JACNNN80
    @JACNNN80 4 месяца назад +2

    Best tutorial i ever seen thank you so much.🎉

  • @ricseljohnresare4503
    @ricseljohnresare4503 9 месяцев назад +4

    Thank youuu it made my project better a 100%

  • @user-qj2eq5mq5w
    @user-qj2eq5mq5w 3 месяца назад +1

    "Thank you very much for creating these videos."

  • @Tornado-ln7fq
    @Tornado-ln7fq 5 месяцев назад +4

    That's what you can't do, it's to move to the center of h1 using text align. It is better to wrap the text separately in a block, and set it from the parent block margin 0 auto; And add the text style separately.

  • @debs.1037
    @debs.1037 18 дней назад

    What an amazing video! This is the first project that I managed to finish completely, and I learned a lot. Thank you!

  • @TemitopeElizabeth-ek7fv
    @TemitopeElizabeth-ek7fv 4 месяца назад +1

    Amazing 👌 followed the steps and the result was nice. Thanks sir Codehal
    😊

  • @toyotasupra0
    @toyotasupra0 8 месяцев назад +1

    amazing work brother

  • @LifterAndy
    @LifterAndy 11 месяцев назад +17

    Thank you! I just made the same one!❤

    • @zeta1527
      @zeta1527 8 месяцев назад +6

      if u want to learn faster do something else but with the things that youve learned from this vid. like a login form but in your own style

  • @idachemoses228
    @idachemoses228 19 дней назад

    You're such a great teacher. Thank you sir.

  • @muhammadshees8417
    @muhammadshees8417 8 месяцев назад +1

    Most amazing video that I have ever seen my brain tell me to write this comment great video ❤

  • @MSS_Akram
    @MSS_Akram 7 месяцев назад +2

    awesome work dude....also it'll be more impressive if we have hover feature when we move our pointer across the login button....if possible please comment down the code for that one

  • @InPixel180
    @InPixel180 2 месяца назад

    Thanks a lot Mate! This really helped me in my Coding Journey!

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

    thank you so much. for such a beautiful contents.

  • @russ_the_ceo6456
    @russ_the_ceo6456 5 месяцев назад

    Thank you! Very helpful and easy to follow along.

  • @mrraj7534
    @mrraj7534 10 месяцев назад +4

    Great work

  • @pvksmaheeth8816
    @pvksmaheeth8816 8 месяцев назад +1

    thank you so much perfect design

  • @saismile1045
    @saismile1045 9 месяцев назад +3

    Thanks a lot dude!!!😍😍😍💯💯💯🔥🔥🔥✊️✊️✊️

  • @arielb102011
    @arielb102011 Месяц назад +1

    I had to set an id to that first . I could not use the class in the css

  • @muppasaikrishna9403
    @muppasaikrishna9403 8 месяцев назад +81

    In the style.css file you imported the url you didn't show that where did you imported that

    • @ayeminkyaw3754
      @ayeminkyaw3754 4 месяца назад +12

      It doesn't matter because the programmer already knows about that.

    • @vaibhavshukla1659
      @vaibhavshukla1659 3 месяца назад

      Same question ❓

    • @sanjaymishra-ec9lw
      @sanjaymishra-ec9lw 3 месяца назад +4

      They import Google fonts from Google.

    • @alonefill
      @alonefill 3 месяца назад

      Same question 🥺

    • @Anshu_0.7
      @Anshu_0.7 3 месяца назад +2

      Import in the same folder where you have created the project

  • @hemashirisha9522
    @hemashirisha9522 8 месяцев назад +1

    Thank you so much .. this video helps me a lot

  • @Kellynaij
    @Kellynaij 2 месяца назад +1

    This video will be so helpful to me cos I really need to do something like this but I don’t know how to use html and css very well just wish I can learn from you
    This video is so beautiful btw thanks

  • @casualxtalks
    @casualxtalks 12 дней назад +2

    Thanks for this amazing video!!!!

  • @muppasaikrishna9403
    @muppasaikrishna9403 8 месяцев назад

    This content enough to subscribe this channel

  • @Got-it747
    @Got-it747 5 дней назад

    I am genuinely grateful for this video. Thank you so very much.

  • @adnaanmohammed3807
    @adnaanmohammed3807 7 месяцев назад +1

    Thanks Instructor🙏

  • @Anonymous_Kid12
    @Anonymous_Kid12 9 месяцев назад +2

    Sir Salute 🫡❤

  • @StylishBanditSlayerS
    @StylishBanditSlayerS 3 месяца назад +1

    Thank You So Much For All Bro!!!! This Is So UseFull For Us!!!!! Thank You So Much For All Bro!!!!!

  • @user-cq1of5tg2p
    @user-cq1of5tg2p 6 месяцев назад +1

    Izin menyimpan video bro, buat tugas sekolah, thankss ✨

  • @anthonyoneal1856
    @anthonyoneal1856 2 месяца назад +1

    used this for a live exercise to get my feet wet into, CSS. I like the style but want to learn the element on my own.

  • @user-tz6cz4ns5g
    @user-tz6cz4ns5g 7 месяцев назад +1

    thank you bro you are helping me to learn something new 😊😊

  • @deltalight5894
    @deltalight5894 Месяц назад

    Thanks to you I learned how to center a div(also trying not to fall in tutorial hell by following different objects making a few small changes for example the background, I set it as an URL and made a few changes to make it look good)

  • @SupardiAtisina
    @SupardiAtisina 10 месяцев назад +1

    Thanks bro I am from indo love your channel

  • @diegomatallana7994
    @diegomatallana7994 4 месяца назад +1

    Thanks for this video I used this format for practice, but I made with Dragon Ball tematic ☺

  • @saba-tabagua
    @saba-tabagua 4 месяца назад +1

    thank you for this evrything and good luck in you career

  • @elhansultanov7891
    @elhansultanov7891 7 месяцев назад +1

    This is really amazing man😍😍😍

  • @bajutaboy7588
    @bajutaboy7588 2 месяца назад

    Respect for you blood Good Creativity and awesome Idea...

  • @anshultipnis6963
    @anshultipnis6963 7 месяцев назад +1

    thank you brother helped me a lot

  • @victorgaliza
    @victorgaliza 4 месяца назад +1

    it's so satisfying ☺️❤

  • @user-md-masum-billah
    @user-md-masum-billah 2 месяца назад +1

    really nice tutorial❤

  • @frederichope2573
    @frederichope2573 6 месяцев назад +1

    Love this ❤

  • @-sheny215
    @-sheny215 7 месяцев назад +1

    nice design :)

  • @jesustod8926
    @jesustod8926 16 дней назад +1

    Thanks bro nice video and the login is PRO

  • @apxlegend8085
    @apxlegend8085 10 месяцев назад +4

    Great work bro keep it up ❤

  • @OmarAhmed-hy8pd
    @OmarAhmed-hy8pd Месяц назад +1

    Why did he use the ?
    Isn't it used to make an italic style ??

  • @maangoswami5622
    @maangoswami5622 Месяц назад +1

    Thank you very much for this video, it was very informative

  • @lofiremixsongs2003.
    @lofiremixsongs2003. 5 месяцев назад +2

    thanks for help to create my first css lagin page
    thank you so much

  • @samuel-Geometry
    @samuel-Geometry 3 месяца назад +1

    Thanks you for this video, you are amazing, i will want do some that in the future

  • @strikerjay4802
    @strikerjay4802 9 месяцев назад +6

    How do you make it where when you click login it actually works and makes you go to the website while being logged in. I need one for a teacher versus student where the teacher can do things the student can't. also with forgot password etc how do I make those applicable?

    • @leonardonunes1199
      @leonardonunes1199 9 месяцев назад +2

      Those thing you said need a backend project, starting with MySQL database. Now, to make all the buttons applicable, you need to create a several pages and link them to the buttons. It's not hard hard work, it's not a free work either. Requires studying and practicing.

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

      Just wrap them in an anchor tag. If you want the login button to take you to another website, put an tag first with the href of that target website and inside the tag have your login button. On pressing the button, it will take you to the target website. Do the same for any button that you want to open a different website to

  • @ritafrontend-qc7pu
    @ritafrontend-qc7pu 9 месяцев назад +1

    amazing

  • @hkynltn
    @hkynltn 6 месяцев назад

    Thankyou you saved me my teacher is happy

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

    please do a tutorial on how to do a website like google drive and pls do it for beginners

  • @trillkodex1235
    @trillkodex1235 3 месяца назад

    Best Tutorial wow!

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

    Thank you lots lotssss!!!!

  • @user-ji3ln7gs1c
    @user-ji3ln7gs1c 3 месяца назад +2

    Thanks it was ver helpfull for me ❄

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

    Thanks alot!

  • @_remix5650
    @_remix5650 9 месяцев назад +1

    thank you 😍😍😍

  • @watiley
    @watiley 6 месяцев назад

    Beautiful ❤

  • @hamdaabdirahman815
    @hamdaabdirahman815 10 месяцев назад +2

    wow😍

  • @user-qe8tk3fy3p
    @user-qe8tk3fy3p 26 дней назад

    great lt is helped me in web desining😄

  • @JorusPospolitus
    @JorusPospolitus 11 месяцев назад +3

    Can you make a tutorial for interactive menu?

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

    Thank you❤️

  • @gabilegend1606
    @gabilegend1606 10 месяцев назад +1

    Nice!

  • @nabeelmirza8801
    @nabeelmirza8801 11 месяцев назад +2

    Wow it is really cool thx

  • @pawanlakshan2507
    @pawanlakshan2507 5 месяцев назад +1

    thanks a lot. 😄❤

  • @F4LLFn
    @F4LLFn 9 месяцев назад +2

    Nice video bro. How i can have this Theme ?

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

    Amazing brother

  • @thovarisk8699
    @thovarisk8699 8 месяцев назад

    NGL very nice!!

  • @roquinhas1951
    @roquinhas1951 Месяц назад

    this is so beautiful... wow

  • @hemavarshini1822
    @hemavarshini1822 3 месяца назад

    Thank you so much . The Video is very useful.

  • @mr.roid780
    @mr.roid780 7 месяцев назад

    thank you sir/mam

  • @maangoswami5622
    @maangoswami5622 Месяц назад

    Thank you very much for this video

  • @victorga74
    @victorga74 3 месяца назад

    Great work! Thanks

  • @unnathpgowda5437
    @unnathpgowda5437 9 месяцев назад +4

    If I am giving a padding to .input-box input the size of the input box is increasing rather than what happened in the video. Can you please tell what I might be missing

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

      I think its for the placeholder not sure which part of the video your saying

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

      What to do bro did u get it

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

      .input-box input {
      height: 100%;
      width: 100%;
      box-sizing: border-box;
      }
      add the box-sizing property

  • @ElectronsX
    @ElectronsX 26 дней назад

    Amazing video! Great help.

  • @arash8942
    @arash8942 2 месяца назад

    Awesome 👌

  • @2steptv741
    @2steptv741 8 месяцев назад

    thank so much my Freind

  • @portugalsemfiltro
    @portugalsemfiltro 26 дней назад

    Te amo, seguindo e aprendendo!

  • @ariel2004
    @ariel2004 2 месяца назад

    super duper thank you❤

  • @Aditya-jv9mp
    @Aditya-jv9mp 4 дня назад

    9:50 felt magical

  • @fabriwaliase8633
    @fabriwaliase8633 2 месяца назад

    Thank you so much, my login website is amazing now
    🥰🥰

  • @sirius___
    @sirius___ 9 месяцев назад +1

    niceeeeeeeee

  • @sodasoda-ml4iw
    @sodasoda-ml4iw 11 месяцев назад +1

    tambbah js tuan

  • @abhishekbidare4167
    @abhishekbidare4167 Месяц назад

    thank you so much 🥰

  • @nikhilramteke6944
    @nikhilramteke6944 3 месяца назад

    amazing and thankk you!

  • @reyhanpanahi6368
    @reyhanpanahi6368 23 дня назад

    The was perfect 🥰 thanks

  • @gabrielOkunola-wp4pt
    @gabrielOkunola-wp4pt Месяц назад

    thank you you have inspired me to do more😎😎😍😍