Botões no documento HTML

Formulários / Tutorial HTML5

Como adicionar botões no documento HTML?

Utilize o elemento <button> para adicionar um botão em um documento HTML.

Exemplo:

<button>Click me</button>

Tipos de botões no HTML

Existem diferentes tipos de botões que você pode usar no HTML:

  • <button type="button">: Um botão de entrada.
  • <button type="submit">: Um botão que envia um formulário.
  • <button type="reset">: Um botão que reseta os campos de um formulário.

A principal diferença entre <button> e <button type="submit"> é que o botão de envio (submit) envia os dados do formulário para o servidor quando clicado, enquanto o botão (button) pode ser usado para outras ações, como executar scripts JavaScript.

Exemplo de um botão de envio:

<form action="/submit" method="post">
  <input type="text" name="name">
  <input type="submit" value="Enviar"> 
  <button type="reset">Limpar</button>
</form>

O tipo padrão de um botão <button> é tyep="button", que não envia o formulário quando clicado. O elemento <input type="button"> é uma alternativa, mas <button> é mais flexível e recomendado para novos projetos.

Como desabilitar um botão HTML?

Para desabilitar um botão HTML, você pode usar o atributo disabled. Aqui está um exemplo:

<button disabled>Você não pode me clicar!</button>

Principais atributos do elemento <button>

  • type: Define o tipo do botão (button, submit, reset).
  • disabled: Desabilita o botão.
  • name: Nome do botão.
  • id: Identificador único do botão.