html
  1. html-button-tag

HTML <button> Tag

  • The HTML <button> tag is used to create a clickable button within an HTML form.
  • It allows you to place content like text or image inside the button.

  <button >Click Me !</button>
Try Playground

Importance of the Button Tag

  • The <button> tag is important because it allows you to create a clickable button within an HTML form on a web page.
  • The <button> tag can help to improve the user experience of a web page.
  • Search engines use the <button> tag to index the structure and content of web pages.

Button Tag Attributes

The `<button>` tag has several attributes that can be used to customize the behavior and appearance of the button.

  1. type

    Specifies the type of button.

    • submit: Submits the form data when clicked.
    • reset: Resets the form's data to its initial values.
    • button: Acts as a standard button.
    <button type="button" >Click me!</button>
    <button type="reset" >Click me!</button>
    <button type="button" >Click me!</button>
    
  2. name

    Assigns a name to the button, which can be useful when submitting a form.

      <button name="submitButton">Click me!</button>
    
  3. value

    Defines the value associated with the button.

      <button value="SubmitForm">Click me!</button>
    
  4. submit

    ype button to set the value that gets sent to the server when the form is submitted.

      <button type="submit">Click me!</button>
    
  5. disabled

    Specifies whether the button is disabled or not.

      <button type="submit" disabled>Click me!</button>
    

Using the Button Tag with CSS

CSS can be used to style the <button> tag and its contents.

.button {
background-color: #51b56d;
color: white;
padding: 10px;
border: none;
border-radius: 5px;
}
Try Playground
Published on: