SEARCH
Newsletter
Subscribe to get design
tips, latest trends, free
stuff and more.
It doesn't look like an e-mail address

hosting

  Tutorials HTML and CSS Tutorials The Button Tag

The Button Tag

fluffbucket Tutorials Oct 14, 2005

We've seen all the basics you need to know about for adding a inputs with forms.

Traditionally the <input type="button"> tag (together with submit and reset types) was used to create buttons for forms.

The buttons created although functional had their limitations (usually grey with black text)

But in HTML 4.0 a new way of adding buttons was born

The <button> tag was launched

To add it just add the HTML as described elsewhere on this tutorial area

Here's a simple example

<button type="submit">send</button>

Okay not too different so far. You must designate what type of button you have (use submit, reset and button) using the type attribute. Note how the simple text becomes the name on the button

You can add name and value attributes as before if you want.

Now the cool thing is that you can alter the button's label with ease

e.g.

<button type="submit">
<font color="#FF0000">
<b>send</b></font>
</button>

gives rise to  

You can add images with all the power of the image tag

e.g.

<button type="submit">
<img src="/img_articles/6156/b_stone.gif" alt="send" align="middle">
<b>send</b></button>

You could even add a table if you were feeling mad enough

This adds more flexibility to your Forms

Your Link image 2 The Button Tag Your Link

I hope this came in useful!

   
subscribe to newsletter