24: Forms In HTML and CSS | How To Create A Form | Learn HTML and CSS | HTML Tutorial | CSS Tutorial

Поділитися
Вставка
  • Опубліковано 19 вер 2024

КОМЕНТАРІ • 160

  • @Dani_Krossing
    @Dani_Krossing  Рік тому

    NEW UPDATED 2023 COURSE AVAILABLE! 🙂
    You can find it here: ua-cam.com/video/v8jDnBYc0bs/v-deo.html&ab_channel=DaniKrossing

  • @Vincent-fs8ry
    @Vincent-fs8ry 6 років тому +116

    The best way to practise css and html is to make a Project and Google how to do things

    •  5 років тому +4

      That's how I've learned, and then I come and watch this amazing series only to find that I was on the right track, all the while learning little tweaks to refine my work.

    • @informativecontent4778
      @informativecontent4778 4 роки тому +5

      google is public enemy use duckduckgo

    • @anujkhare3815
      @anujkhare3815 4 роки тому

      @@informativecontent4778 LOL. MAN YOU'RE FUNNY . I LIKE YOU
      3

    • @real_yoplayer1
      @real_yoplayer1 4 роки тому

      @@informativecontent4778 enemy ????

    • @real_yoplayer1
      @real_yoplayer1 4 роки тому

      and I also watched this video like this
      and w3schools.com (Think the URL is right )

  • @Graferification
    @Graferification 6 років тому +38

    I recommend using labels in forms instead of plain text or just placeholders. Mainly for accessibility reasons, for people using screen readers or people with memory impairments. That should be a good practice. Apart from that, very good tut :) Cheers.

  • @akshayar3474
    @akshayar3474 3 місяці тому +1

    thank you so much sir i watched lot of videos related to this but this is the best way

  • @tanishakumar8831
    @tanishakumar8831 3 роки тому +3

    Thanks you taught me better than my computer teacher. It helped me for my exam's last night preparation.

  • @adamv8699
    @adamv8699 5 років тому +4

    Your videos are awesome. You're a great teacher. maybe you could do a video on making a login form with all the bells and whistles in it for a project.
    Question: is it better to make all the form elements inside labels for ease of styling? < input= or button= or etc..?>

  • @anna-aleksandraruohonen1727
    @anna-aleksandraruohonen1727 4 роки тому +6

    Thank you, super useful tutorial! Next I'm going to find out the PHP thingy, wish me luck :D

  • @nevinkuser9892
    @nevinkuser9892 4 роки тому +1

    You answered my main question in the first minute of the video. Well done!

  • @angelalasquite
    @angelalasquite 3 роки тому +3

    I'm learning a lot from you, Dani. What a great tutorial you have!

  • @timothymchardy5098
    @timothymchardy5098 3 роки тому +7

    8:04 man felt his career slipping away for a sec

  • @thetowerfantasymusic
    @thetowerfantasymusic 3 роки тому +2

    You're a lifesaver, thanks !!

  • @meron5706
    @meron5706 4 роки тому +36

    "because i guess there is another gender eha" lmfao

    • @edogawaeduardus6149
      @edogawaeduardus6149 4 роки тому +1

      @Able blyat

    • @kinghassy334
      @kinghassy334 4 роки тому

      @Able Don't worry bro I respect your gender

    • @asrieldreemurr8299
      @asrieldreemurr8299 4 роки тому +2

      Last I checked there were only two genders. Even lesbian or homosexuals still have a gender. Everything else should be species.

    • @kinghassy334
      @kinghassy334 4 роки тому +5

      @@asrieldreemurr8299 gender and sex are two different things, sex is what you are biologically and genetically, gender is how you're socially categorized by your culture

    • @Moodboard39
      @Moodboard39 2 роки тому

      No other gender . People are insane if they think that

  • @franciscosuarez5891
    @franciscosuarez5891 6 років тому +3

    Great video, Daniel. I have learned really good things to modify the surveys appearance, I'm going to put this in practice. Thank you for work and keep doing awesome lessons.

  • @Adam-gp3ij
    @Adam-gp3ij 4 роки тому

    Best tutor ever for web programming

  • @GeorgeKoukoulis-g6l
    @GeorgeKoukoulis-g6l Рік тому

    Your teaching skills are super, but there is no other bro. Thank you anyway

  • @zko5906
    @zko5906 4 роки тому +1

    Amazing tutorial, easy and fun. No more frustration with forms. Really, it's very easy thanks to this video :)

  • @DDLYkitten
    @DDLYkitten 2 роки тому +1

    thank you I have a midterm in 4 hours

  • @mihiiiiiiiii
    @mihiiiiiiiii 2 роки тому

    Seriously, I saw many videos to explain me forms....but thiisss iss thheee bessstttttt!!! I swear!❤❤🤍🤍
    You explain so well!
    loved it!

  • @KalamataInfo
    @KalamataInfo 6 років тому +4

    I recommend using labels in forms instead of plain text or just placeholders. Mainly for accessibility reasons, for people using screen readers or people with memory impairments.

    • @Dani_Krossing
      @Dani_Krossing  6 років тому +5

      Hehe funny how I received a comment From Filip, two hours earlier from yours that is completely identical word for word, in this same video :)

  • @ruthgibson8289
    @ruthgibson8289 2 роки тому

    looking for an easy explanation for my students. This Video does a nice job!

  • @zarirramiz8978
    @zarirramiz8978 Рік тому

    Thank you best teacher

  • @zeggxr1539
    @zeggxr1539 4 роки тому +2

    i loved the way how you teach man, here is a question how can i get better when i learned programming in c# html php..

  • @hpottstock
    @hpottstock 4 роки тому +1

    Great tutorial mate, thanks. The melody of your speech reminds me a bit of Christopher Walken :)

  • @hachij_
    @hachij_ 6 років тому +10

    really nice tutorials. keep it quality up!

  • @averagemanful
    @averagemanful 5 років тому +18

    Option 1 Gender male.
    Option 2 Gender female.
    Option 3 "Chuckles" Other.
    This man gets it lol

  • @learnersConcepts-24
    @learnersConcepts-24 3 роки тому

    Good teacher

  • @GoldenToothBrush
    @GoldenToothBrush 5 років тому +3

    Hi and thank you for the great tutorial.
    I've noticed that when you used the value attribute with radio and typed in the genders the genders came up on the page like a label next to the circles. In other tutorials I've learned about the label tag. I was wondering if there is any reason to ever use the value attribute over the label tag and vice versa or are they always interchangeable? Also i was wondering what the point of the get value is? Could you not just use the post value all the time? What i mean is if you were not sending sensitive info why would it make any difference?
    Thanks in advance!

  • @robertwalls533
    @robertwalls533 4 роки тому +1

    Enjoy your videos. I was just wondering to add an email contact form to the website would I need to change my index.html file to php or would I create a new file and name it php. How would I apply that to my contact page of the website. Thanks for the help.

  • @aahanmaheshwari8202
    @aahanmaheshwari8202 3 роки тому

    DANI KROSSING IS OP
    Edit: I didn't make this comment to get a heart from Dani Krossing. I made this comment because he actually deserves it. You are really awesome, keep up the good work and keep educating us! Thank you for such helpful videos!

  • @khanshahin4905
    @khanshahin4905 Рік тому

    I create a form html page with javascript. After submit form input value save in to database but if I click browser back button I see all the value displaying on the page. In this case what I have to do?

  • @xyuria5300
    @xyuria5300 3 роки тому +1

    My teacher is making us do this assignment and with 19 questions in a edpuzzle.
    Pain.

  • @ademottoman962
    @ademottoman962 5 років тому +1

    can you make a video explaining how to like edit the text decoration if you want it to bee only in contact page not in every page

  • @anulrajeev7891
    @anulrajeev7891 4 роки тому

    What is the difference between using name attribute instead of value in the ? Do they mean the same for ?

  • @sad_boy5589
    @sad_boy5589 2 роки тому

    Hi Dani, I watched your video but couldn't find my answer. I have made a fillable form but I need to align the text, how shall I do it. for example Student admission____ Name of the student___ "how to give equal space on the left and right of the page/form.

  • @cfuman
    @cfuman 2 роки тому

    Very informative, thank you!

  • @newtonoluoch5074
    @newtonoluoch5074 3 роки тому

    Thanks for this, very elaborate.

  • @kamalizamclaire57
    @kamalizamclaire57 5 років тому

    nice one ...... i like thia video

  • @tomisinergy4963
    @tomisinergy4963 4 роки тому +1

    < It was great HTML tutorial :-)>

  • @adreannaaaaa
    @adreannaaaaa 5 років тому

    i really love all your explanation, very details for someone who know nothing like me. keep it up! :)

  • @emalfiza3386
    @emalfiza3386 5 років тому

    very easy and spot on. cheers buddy

  • @electronicheartbreak.
    @electronicheartbreak. 6 років тому +2

    Good video as always👌🏻. Can you make a video about the , etc tags?

  • @carloslopez9939
    @carloslopez9939 3 роки тому

    Thanks a lot bro, great video. SUBSCRIBED! : )

  • @teenytinytoons
    @teenytinytoons 3 роки тому

    fantastic tutorial.

  • @shumasumer37
    @shumasumer37 6 років тому

    Thanks for you help dude !!!
    Very nice video

  • @istiv
    @istiv 3 роки тому

    Great tutorial this is.

  • @TheTyronesf
    @TheTyronesf 3 роки тому

    Thank you.

  • @xxm3linaxx
    @xxm3linaxx 4 роки тому

    How do you style the radio buttons? like move them around with the text you showed in this video?

  • @GLoop無縫循環歌曲
    @GLoop無縫循環歌曲 5 років тому

    Much thank you from Malaysia

  • @shervinafzali7587
    @shervinafzali7587 6 років тому +1

    thank you for your incredible tutorials... I just have a question, why did you type a comma in "input, textarea {}"? in previous tutorials you mentioned that when we are calling a subgroup in a stylesheet, we just use a space!

    • @rspsratings8240
      @rspsratings8240 6 років тому +1

      That's how you style multiple elements at the same time. Saves writing it twice.

  • @heyjulyabas1681
    @heyjulyabas1681 3 роки тому

    THANK YOU

  • @rupensoni1883
    @rupensoni1883 4 роки тому

    liked it

  • @rondajones7584
    @rondajones7584 3 роки тому

    I have made a contact form with html and css. How do I make it work where it will send the email to my business email

  • @77kcormahs
    @77kcormahs 5 років тому

    Thanks for the help!

  • @yanyenajangbuja4418
    @yanyenajangbuja4418 3 роки тому

    exactly at my own pace

  • @SHtechnology
    @SHtechnology 4 роки тому

    That's great!

  • @sederick80
    @sederick80 4 роки тому

    Great Video!! Anything on accessibility in HTML? :)

  • @strawberrycm5073
    @strawberrycm5073 4 роки тому

    Hi, are you able to do a video on auto pop-up email subscription form ?

  • @photon2724
    @photon2724 5 років тому +5

    i got confused in the scudo stuff.

  • @Scared_Cat003
    @Scared_Cat003 3 роки тому

    What is the purpose of value in input advance thanks for answering

  • @Sawk-cy7wz
    @Sawk-cy7wz 2 роки тому

    4:03 you can have a type of email

  • @origreenberg7764
    @origreenberg7764 5 років тому

    very good video

  • @mikemkgta5988
    @mikemkgta5988 4 роки тому

    this really help thank you

  • @dexterstm
    @dexterstm 6 років тому

    Hey Bro if you have the time do you mind doing a video explaining in more details of how and when to use pseudo element? i have been researching for some post but i still couldn't grasp on how to use pseudo elements. Thanks

    • @Dani_Krossing
      @Dani_Krossing  6 років тому

      Great idea for a lesson :) I will add it to my lesson planner

  • @SLL-033.shanks.
    @SLL-033.shanks. 7 місяців тому

    When creating form, is css and JavaScript is that necessary???

    • @Dani_Krossing
      @Dani_Krossing  7 місяців тому

      JavaScript and CSS isn’t required no, unless you plan on using forms for something out of the ordinary. 🙂 Only HTML is “required” when creating forms.

  • @TakiTarik
    @TakiTarik 3 роки тому

    Hey i hope you will reply or someone will i have an assignment in college and uhm i created my form i'm building a full website but i keep having issues with my H1,H2 etc div element that i've used before in my whole html and css file they keep messing up the input i have placed in my FORM D: it's frustrating not sure how to fix it

  • @arushgupta5784
    @arushgupta5784 3 роки тому

    where is the data saved after submitting????how to save it????????

  • @TrungHoangMinh1234
    @TrungHoangMinh1234 6 років тому

    thank you so much for the video

  • @karan_yt_family
    @karan_yt_family 4 роки тому

    ur ossam broski

  • @koenterheegde9328
    @koenterheegde9328 5 років тому

    I had the issue that the text in front of the radio types didn't show up. It was caused by the colon after the gender types. How can I have the colon and still see the text in front of it?

  • @Odnal8253
    @Odnal8253 6 років тому

    It would have been great if you could have actually showed us how to use flexbox on the radio buttons, just to keep the practise going. Unfortunately I was not able to apply flexbox to them successfully. Nonetheless, great video.

    • @joshuamoskovitz4074
      @joshuamoskovitz4074 4 роки тому

      Same here. It works with bootstrap but I couldn't get the radio button and the text on the same line unless all 3 were on the same line.

  • @izzykhan2143
    @izzykhan2143 4 роки тому

    The resizing for me will not work and idk why. I am transferring my files into filezilla on a host server so maybe it has something to do with that?

  • @informativecontent4778
    @informativecontent4778 4 роки тому

    i just subbed dude thanks

  • @mfkrmaggot2755
    @mfkrmaggot2755 4 роки тому

    so how do i view the responses? Great video, btw

  • @shaytheswift_4327
    @shaytheswift_4327 3 роки тому

    Great tutorial but my radio buttons dont deselect automatically

  • @vihangajuly6316
    @vihangajuly6316 4 роки тому

    thank you,sir

  • @olekristianrannekleiv762
    @olekristianrannekleiv762 4 роки тому

    Well explained but for people who have no experience with forms, this is to much information in one video, I would rather split the video up in 2 or 3 videoes.

  • @ryangardiner919
    @ryangardiner919 6 років тому

    What does the value do?

  • @justarandomguythatliketotr143
    @justarandomguythatliketotr143 5 років тому

    guys i need help how can i nest html forms inside the box, The Input And label i mean

  • @kvng_Edwin
    @kvng_Edwin 6 років тому

    Nice one ... I love this video

  • @kmisdone
    @kmisdone Рік тому

    2:49 video starts and his updated version for forms is ua-cam.com/video/qelcFC6B_Nw/v-deo.html

  • @coffe06
    @coffe06 5 років тому

    how come you got you password for lined up underneath the other forms you did, and i get it to the right of the others, just lucky?

  • @danielsloberg8726
    @danielsloberg8726 3 роки тому

    2:37 No. Thank you for explaining that. It is necessary and you should be proud of yourself for having those values my dude. Keep that sh** up.

  • @kianaadili505
    @kianaadili505 5 років тому

    tysm i love u

  • @nahidestes
    @nahidestes 5 років тому

    What is your laptop name?

  • @rossmcintyre61
    @rossmcintyre61 3 роки тому

    i skipped forms and nav bars to be honest and im learning bootstrap atm and having to backtrack learn these components first

  • @user-or7ji5hv8y
    @user-or7ji5hv8y 5 років тому

    How does one display data possibly coming from a database onto the browser? Did you have a lesson on that as well?

  • @_Omni
    @_Omni 6 років тому +19

    8:18 other, lmao

  • @pavit9247
    @pavit9247 6 років тому

    Hey bro i was learning php from your tutorial series. I got really confused what you made server and used php and other stuff to store password and stuff. What should i do i watched it 2-3 times but it keeps getting off my mind. I watched every other your html,css and JavaScript series but I don't know what should i do with the php.

    • @kvng_Edwin
      @kvng_Edwin 6 років тому +2

      Just follow up from the beginning.. i too did not understand at first... But after so many errors I gat to understand it very well so the more you make mistake the more you get better

    • @stefan4800
      @stefan4800 6 років тому +3

      You are using PHP to store information out of your computer, somewhere on the Internet, in the real world. In the real world you won't use things like XAMPP, you know your local server, in reallity you will use some server who knows where and you will store data on some database on Internet, not on your computer. When you use local server you are storing data on your local computer and only you can access it. In reality you want that other people use some data from the database on the Internet, like username or anything alse really, and for that you need to store things out there. PHP runs on the server, on some big server out there and works for your app: storing data, storing requests, usernames, posts and so on. PHP take the requests and store them in the database, like when user sign up, or retrieve informatoin from the database when the user logged in. When you hit log in button you trigger some code, some combination of PHP and MySQL in similar form: "SELECT * FROM users WHERE username = :username(your input from the form) AND password = :password(yout input from the form)" PHP handle this request on the server and work with MySQL (which storing data like in sprite sheet) to check do you exist like a user or not. You can't use Javascript for that because Javascript runs on your browswer (on your local, personal computer and does not see further than that), not on the server and you can use Javascript only for effects when you receive data from the server. PHP, in the other words, serve your clients, serve your application and work in combination with mostly MySQL to store or retrive data from the real databases in the real world, on the Internet, unlike Javascript which runs on your computer, on a local softwares like Chrome, Firefox or Opera and you can use it even without Internet connection. To use PHP you NEED a server, and that's why you install XAMPP which is an improvised server and it's useful only for development, not in the real world.

    • @pavit9247
      @pavit9247 6 років тому

      Thanks man

    • @pavit9247
      @pavit9247 6 років тому

      I will try again today

    • @Moodboard39
      @Moodboard39 2 роки тому

      @@stefan4800 So you practice using a server in your PC ? Using xmapp?

  • @josephkasongo1876
    @josephkasongo1876 5 років тому

    😍😍👏

  • @calibr0636
    @calibr0636 5 років тому +2

    Came back because I forgot about textarea

  • @wello7266
    @wello7266 4 роки тому

    Oh and you didn’t mention auto write so when you did email you should make type=“email” not sayin your wrong just saying you didn’t metion

  • @andoy_abarquez
    @andoy_abarquez 6 років тому +2

    2nd comment ;)

  • @espectrodormin
    @espectrodormin 5 років тому +1

    "Why should you learn it now... Instead of waiting to learn another language first?"
    And here I am, learning both at the same time lol

  • @dreamscapeai7
    @dreamscapeai7 5 років тому

    Video starts at 2:40

  • @AhmetBD1
    @AhmetBD1 3 роки тому

    O'pıl indeed

  • @netbat
    @netbat 4 роки тому

    he starts coding at 2:52

  • @Vincent-fs8ry
    @Vincent-fs8ry 6 років тому

    Good video but i already knew all of this!

    • @Dani_Krossing
      @Dani_Krossing  6 років тому

      Yes some of these HTML lessons are going to be updated versions of previous videos. But because there are so many new features in HTML and CSS, there will also be much new information in this course :)

    • @gmarsenopoulos
      @gmarsenopoulos 6 років тому

      Do you have a upload scedule for the updated versions? Because I am new in front end dev and I want to learn and keep track of your tutorials. You are great teacher!

  • @nicholasdiaz2045
    @nicholasdiaz2045 Рік тому

    Only 2

  • @dancarter6044
    @dancarter6044 2 роки тому

    What kind of idiot doesn't set a name and value for a submit? If you set a name, you can have more than one submit in a form that can trigger different actions.

    • @Dani_Krossing
      @Dani_Krossing  2 роки тому

      I'm very confused about this comment. 😅 Are you calling me an idiot or...?
      A "name" attribute isn't always needed depending on the application, and a value is not needed either when sending the data. 🙂
      And no, multiple submits won't trigger different "actions", they would all trigger the same "action" attribute set in the "form" element. 🙂
      ... Either I am completely misreading your comment, or you feel extremely strongly about some misinformation that was given to you. 😂 I can't help but giggle a bit over the irony of you calling people "idiot" if they didn't do things your way hehe.

    • @dancarter6044
      @dancarter6044 2 роки тому

      @@Dani_Krossing No if you name a submit button, you can have multiple ones in the same form and they can trigger different action in PHP after the form values are sent to the server.
      if(isset(subEdit))
      {
      //profile edited
      }
      elseif(isset(subDelete))
      {
      //profile deleted
      }
      A submit button's value is its label like "Edit Profile"
      Better yet to use the Edit Form. Then you can have a label that is different than its value.

  • @matthewwellik3126
    @matthewwellik3126 6 років тому

    cute