HTML: create button - how it works

You will always need buttons on your website and especially in forms. We explain how to create them with HTML.

Create HTML buttons:

You need classic buttons especially in the form of a form. Therefore you should embed the following scraps of code in the element.
We explain in detail how to create a simple form here.
You can create buttons with different elements. The most obvious method is the element.
You use the "type" attribute to define different functions.
type = "submit" is the standard use of the button element. This creates a submit button for the associated form.
type = "button" defines the button without a fixed action. In this case you can, for example, write a script yourself and link it with the button ID.
type = "reset" resets the entries in the associated form to the initial values.
Please note that in the "form" element of the form you have to define the attributes "action", "method" and possibly "enctype" so that you can send data.
You can also use the "name" and "value" attributes.
With this combination, you can also send a button with a defined value by clicking a button, which is coupled with the under defined name.
This is useful if, for example, you provide two or more "Submit" buttons.
Write the text that your button displays between the opening and closing button elements.
For example, you could put such a button at the end of your form: I agree

You can also use the form element to create buttons.
Note that this is a standalone element and you don't need to close it.
Depending on the HTML version used, you can indicate this with the /> or do not have to mark it at all.
For buttons, too, you define the button type with the "type" attribute.
Here too you can enter submit, reset and button. These then work in a similar way to that described in the previous paragraph.
Since it stands alone, there are differences in the button text displayed. You enter this with the attribute "value".
The button from before would look like this:
Abstract entries for "value" are not recommended here.

With you can also create radio buttons and checkboxes. To do this, enter "radio" or "checkbox" as the type.
When you create a set of radio buttons, only one can ever be active. In contrast, multiple checkboxes can be selected.
You create a set by giving all buttons or checkboxes in the set the same name in the "name" attribute.
Value entries are urgently required here so that data can also be sent. These values should of course differ for the buttons.
If you also want to assign names with the element, you should also assign an ID to each button.
Enclose the element with the element, use the attribute "for" in the element or combine the two methods to connect the label with the button.
If you want a button to be activated by default, add "checked" as a separate attribute.
A radio button set could look like this: I like radio buttons
I don't like radio buttons
Three checkboxes could look like this: I am using HTML4
I use XHTML
I am using HTML5

If you want to summarize your buttons clearly, you can mark them with the element as a set.
Also enter a name for the set with the item.
The radio buttons could look like this: Radio buttons
I like radio buttons
I don't like radio buttons

If you want to use your buttons now, we will explain in the next practical tip how to create HTML forms.