The Complete WebDeveloper (42 Blogs) Become a Certified Professional

How To Best Utilize Button in HTML?

Published on Aug 26,2019 14 Views

MI-new-launch

myMock Interview Service for Real Tech Jobs

myMock-mobile-banner-bg

myMock Interview Service for Real Tech Jobs

  • Mock interview in latest tech domains i.e JAVA, AI, DEVOPS,etc
  • Get interviewed by leading tech experts
  • Real time assessment report and video recording

HTML makes it easier to create buttons. In this article will explore Button In HTML in detail. Following pointers will be covered in this article

So lets us get started with this article,

Button In HTML

In HTML there are various methods to create clickable buttons. Here you can even create buttons using <input> tag by setting it’s type attribute to button. Listing out the type attribute that can take values:

Type

Description

Submit

It creates the button which automatically submits the form or the document. 

Reset

It creates the button which automatically resets the form control to their initial values.

Button

It creates the button which is used to trigger the client side script when the user clicks that button.

Image

It creates the clickable button that we can use the image as a background of the button.

In HTML <button> tag is mainly used to create the button within the HTML form. Still you can use <input> tag to create the same buttons.

Moving on with this article on Button In HTML

Program For Button Tag

Showing the use of <button> tag

<!DOCTYPE html>
<html>
<head>
<title>button tag</title>
</head>
<body>
<form>
<button name="button" name="OK" type="button">Click Here>
</form>
</body>
</html>

Output

Output - Button In HTML - Edureka

Moving on with this article on Button In HTML

Form With Three Types Of Buttons

Here it’s showing the HTML code for the form with three types of buttons:

<!DOCTYPE html>
<html>
<head>
<title>Upload File</title>
</head>
<body>
<form>
<input type="submit" name="submit" value="submit"/>
<input type="reset" name="reset" value="reset"/>
<input type="button" name="button" value="button"/>
<input type="image" name="imagebutton" scr="/C:UsersKATTANISHARADesktopBlogs"/>
</body>
</html>

Output

Output - Button In HTML - Edureka

This brings us to the end of this article on Button In HTML.

Check out our Full Stack Web Developer Masters Program which comes with instructor-led live training and real-life project experience. This training makes you proficient in skills to work with back-end and front-end web technologies. It includes training on Web Development, jQuery, Angular, NodeJS, ExpressJS, and MongoDB.

Got a question for us? Please mention it in the comments section of  article and we will get back to you.

Comments
0 Comments

Browse Categories

webinar REGISTER FOR FREE WEBINAR
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP

Subscribe to our Newsletter, and get personalized recommendations.