Clickable button

Clickable button:
In this tutorial we will create a clickable button. A button will be displayed on browser with assigned button text.

If you want to follow the tutorial please download tutorial template here
If you are following these tutorials continue to use your own source code from previous tutorial.

We will be using the following tags:
•Opening tag <button>
•Closing tag </button>

Firstly inside the opening tag we set the type to ‘button’ because different browsers have different default types. You should end up with the following code which will show a button in your browser with no text on it.

<button type="button"></button>

In between the opening and closing tags you can input text of your choice which will be displayed on the button. In this example I have put ‘Click here’.

<button type="button">Click here</button>

Save your HTML document and test on browser of choice. If you wish to continue following the tutorials type Yes into the table data column after Clickable Button in the completed tutorials table.

<tr>    <td>Clickable Button</td>    <td>Yes</td> </tr>

To download the finished example for this tutorial please click here

The button will be clickable but it won’t do anything until we add an onclick event to the button which I will cover in the next tutorial.

Previous tutorial

Next tutorial