<button>
can contain HTML. <input type="button" />
on the other hand is an empty element (such as br
, hr
, image
), therefore it cannot contain content.<button>
supports pseudo-elements such as :after
and :before
which is very useful to style the button. Whereas <input type="button" />
doesn't.<button>
has the default attribute type="submit"
. It means that if the type
attribute isn't specified, clicking the button will submit its enclosing form.input
to behave as a submit button, we have to change the type
attribute to submit
.button
element is more semantic than the input
with type of button
. It's recommended to use the button
element if you want to create a clickable button.type
attribute for the button
element. The possible values areValue | Description |
---|---|
submit | The button submits the form data to the server |
reset | Resets form inputs to initial values |
button | By default, it does nothing when pressed |