En HTML, la etiqueta <button> se usa para crear un botón en el que se puede hacer clic en su página web. También tiene una etiqueta de cierre escrita como </button>. Puede agregar un texto o una imagen, lo que quiera que muestre un botón, dentro de la etiqueta <button>. El atributo de tipo para una etiqueta <button> siempre debe ser especificado por usted. Cada navegador tiene su propio tipo predeterminado para el elemento de botón.
El botón se puede crear dentro o fuera del formulario. Se puede diseñar de diferentes maneras usando CSS.
Por ejemplo, para crear un botón que tenga el texto «Haga clic aquí» se puede crear como:
Sintaxis:
<button type="button">Click Here</button>
La etiqueta <button> tiene muchos atributos, lo que le da las características deseadas al botón.
El atributo de formulario de la etiqueta <button> se usa para crear un botón que pertenece a uno o más formularios en HTML.
Sintaxis:
<button form="form_id">
Para especificar uno o más formularios a los que pertenece el botón, se utiliza un atributo de formulario . El valor del atributo de formulario debe ser igual al atributo id del elemento de formulario en el mismo documento.
form_id : Especifica el elemento del formulario al que pertenece el elemento <button>. El valor de esta identificación debe ser igual al atributo de identificación del elemento de formulario en el mismo documento.
Ejemplo 1:
HTML
<!DOCTYPE html> <html> <head> <title>HTML form attribute</title> </head> <body> <h1 style="color: green">Welcome to GFG</h1> <!-- To create a form --> <form action="/action_page.php" method="get" id="nameform"> <label for="fullname">Enter your name:</label> <!-- To take input from user in the form --> <input type="text" id="fullname" name="fullname" /> <br /><br /> </form> <!-- Same form id : "nameform" is used --> <button type="submit" form="nameform" value="Submit"> Submit Response </button> </body> </html>
Producción :
Ejemplo 2:
HTML
<!DOCTYPE html> <html> <body> <form id="formid" method="POST"> Username:<br> <input type="text" name="username"> <br> Email id:<br> <input type="text" name="email_id"> </form> <button type="submit" value="Submit" form="formid">Submit</button> </body> </html>
Producción:
Publicación traducida automáticamente
Artículo escrito por muskansatya02 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA