HTML Syntax

<input type = button
   popovertarget = element_id 
   popovertargetaction = hide, show, toggle
>

NOTE: Only the <input> start tag must be present. The element has no end tag.

The <input type=button> element renders a push button on an HTML form.

The text to be displayed in the button is specified thru its value attribute.

<input type="button" value="Click me">

Push buttons have no default behavior. In most cases, a client-side script is associated with any of the element’s event attributes, to make the button perform an action when an event occurs, such as when a user clicks the button.

Browsers normally render the <input type=button> as a basic button with a simple default appearance. Authors may use CSS to vary its appearance though.

Note that authors can create push buttons with the newer <button> element as well, that offers richer rendering capabilities than the this element.

The following shows how the <input type=button> element may be used.

This is done by specifying any ECMAScript-compliant statement or function call as the value of the button’s onclick event attribute. When the event occurs, the associated script is triggered.

<form>
   <input type="button" value="Say Hello"
      onclick="alert ( 'Hello' )">
</form>

The following shows how the appearance and behavior of the button may be altered using CSS.

<input type="button" 
   class="button" value="Say Hello"
   onclick="alert ( 'Hello' )">

.button { 
   font-weight: 600; padding: 5 20;
   color: white; text-shadow: 2px 2px 2px #000;
   background: linear-gradient(steelblue,green);
   box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.6);
   border-radius: 12px;
}
.button:hover {
   cursor: pointer; scale: 1.1;
   background: linear-gradient(red,orange);
   box-shadow: -3px 3px 3px rgba(0, 0, 0, 0.6);
}

• input type="button"

BUTTON   INPUT   INPUT type=reset   INPUT type=submit