
Buttons in html are very useful, with buttons programmer change webpages based on users behaviour. For example , clicking next can run code that cycle through characters.
To create a button users can click on, we need the opening tag <button> and the closing </button>.
<!DOCTYPE html>
<html>
<head>
<title> My first webpage </title>
</head>
<body>
<h1> My first heading </h1>
<p> This is my first paragraph .... more is coming </p>
<p> subscribe to our newsletter </p>
<button> Subscribe </button>
</body>
</html>
Using others elements like <strong> … </strong> inside the button tags can give a bit of style.
…
<button> <strong> Click here </strong> </button>
…
<!DOCTYPE html>
<html>
<head>
<title> My first webpage </title>
</head>
<body>
<h1> My first heading </h1>
<p> This is my first paragraph .... more is coming </p>
<p> subscribe to our newsletter </p>
<button> First </button>
<button> Second </button>
<button> Third </button>
</body>
</html>
Buttons display next to each other even if they are on separate line of code.
If we want buttons to stack on top of each other we can use the <br> tag to place each button on the new line.
<!DOCTYPE html>
<html>
<head>
<title> My first webpage </title>
</head>
<body>
<h1> My first heading </h1>
<p> This is my first paragraph .... more is coming </p>
<p> subscribe to our newsletter </p>
<button> First </button> <br>
<button> Second </button> <br>
<button> Third </button> <br>
</body>
</html>