HTML Button Tags - HTML Tutorial

Buttons are created using the <button> tag. They are often used to submit forms, but they can also be used to trigger events, like running JavaScript.

HTML Button Tags Syntax

Explanation of Syntax:

<button>: The main tag used to create buttons.
type attribute:
- button: A generic button with no default behavior.
- submit: A button that submits the form data.
- reset: A button that resets all form fields.

<!-- Basic Button -->
<button>Click Me!</button>

<!-- Submit Button -->
<button type="submit">Submit</button>

<!-- Reset Button -->
<button type="reset">Reset</button>

HTML Button Tags Example Code

Explanation of Code:

Basic Button (<button>Click Me!</button>): This is a simple button. When clicked, it doesn’t perform any action by default but can be enhanced with additional scripts or functionality later.
Submit Button (<button type="submit">Submit</button>): This button is used within a form. When clicked, it sends the data from the form to the server specified in the action attribute of the <form> tag.
Reset Button (<button type="reset">Reset</button>): This button resets all input fields in the form back to their initial values when clicked.

<!DOCTYPE html>
<html>
<head>
    <title>Button Tags Example</title>
</head>
<body>
    <h1>Button Tags in HTML</h1>
    
    <!-- Basic Button -->
    <button>Click Me!</button>

    <!-- Submit Button in a Form -->
    <form action="/submit" method="post">
        <button type="submit">Submit</button>
    </form>

    <!-- Reset Button in a Form -->
    <form>
        <button type="reset">Reset</button>
    </form>
</body>
</html>

HTML Button Tags Syntax

HTML Button Tags Example Code

HTML Labs