https://developer.mozilla.org/en-US/docs/Learn/HTML/Forms
This module provides a series of articles that will help you master HTML forms.
HTML forms are a very powerful tool for interacting with users; however, for historical and technical reasons, it's not always obvious how to use them to their full potential.
In this guide, we'll cover all aspects of HTML forms, from structure to styling, from data handling to custom widgets.
Prerequisites Section
Before starting this module, you should at least work through our Introduction to HTML.
At this point you should find the Basic guides easy to understand, and also be able to make use of our Native form widgets guide.
The rest of the module however is a bit more advanced — it is easy to put form widgets on a page, but you can't actually do much with them without using some advanced form features, CSS, and JavaScript. Therefore, before you look at the other sections we'd recommend that you go away and learn some CSS and JavaScript first.
Note: If you are working on a computer/tablet/other device where you don't have the ability to create your own files, you could try out (most of) the code examples in an online coding program such as JSBin or Thimble.
Basic guides Section
- Your first HTML form
- The first article in our series provides your very first experience of creating an HTML form, including designing a simple form, implementing it using the right HTML elements, adding some very simple styling via CSS, and how data is sent to a server.
- How to structure an HTML form
- With the basics out of the way, we now look in more detail at the elements used to provide structure and meaning to the different parts of a form.