HTML BUTTONS

HTML buttons are created using the <button> tag or an <input> element.

Basic Button

<button>Click Me</button>

Button with Action

<button onclick="alert('Hello!')">Click Me</button>

Input Button

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

Submit Button (for forms)

<form>
  <input type="text" placeholder="Enter name">
  <button type="submit">Submit</button>
</form>

Reset Button

<form>
  <input type="text" placeholder="Enter name">
  <button type="reset">Reset</button>
</form>

Styled Button with CSS

<button class="btn">Login</button>

<style>
.btn {
  background-color: #4CAF50;
  color: white;
  padding: 10px 20px;
  border: none;
  border-radius: 5px;
  cursor: pointer;
}

.btn:hover {
  background-color: #45a049;
}
</style>

Disabled Button

<button disabled>Disabled</button>

Button with Icon

<button>🔍 Search</button>

Common button types:

• button – General-purpose button
• submit – Submits a form
• reset – Resets form fields

Example:

<button type="button">Normal</button>
<button type="submit">Submit</button>
<button type="reset">Reset</button>