Button Code

[Griffin54]

Hello!

I have created a button in the body my web page using the following code below:

<input type=button onClick="parent.location='btb-lad-home.htm'" value='Home' style="font-family: comic sans ms; background-color: #872175" >

(I have no code for my button in the head of my web page.)

Although the code above creates a button with now problem the button is kind of plain.

I have been searching for more code to make my button more appealing, ie rounded corners.

Does anyone have any suggestions for code that I can add to create rounded corners on my button. Or any other effects?

Thanks.

[Baradaran]

Hi,
I think it is complicated to apply a style to a button. The buttons are displayed differently on different browsers, e.g. in FF they have rounded corners.

You can simply use an image as a button and apply your own styles to the image:

<img src="/images/my_button.gif" alt="The text on the image" onclick="parent.location='btb-lad-home.htm';" />

You can define a class and apply a hover action like move or display another image instead. This will be shown the same way on all browsers.

[johnamold]

<button type="button">Click Me!</button>
Inside a button element you can put content, like text or images. This is the difference between this element and buttons created with the input element.

[drjohn]

Buttons are hard to style, and tend to look different in different browsers.
Buttons are meant to be part of a data collection form, and should not really be used for ordinary links - that's what the "<input type=button" is saying. Input, as in data input.

You hear people talking about links as buttons and so many people wrongly call any link a button. If you want a pretty link, learn CSS and style your links that way.

[SolidSolutions]

Use the image as previously stated. If you need help with making a button image, check out: http://cooltext.com/Buttons

[terabyte]

It depends on your browser.
Use an Image if you want to make it look the way you want.

[tealendril]

I almost always use this code:

<a href="http://address.html" onmouseover="image1.src='button-over.gif';"
onmouseout="image1.src='button.gif';"> 
<img name="image1" src="button.gif"   alt="Home"> </a>

If you want to input several buttons, just change the name of the "image1" to the "image2" etc.

[logoonlinepros]

In different browser this buttons show different result .
IE explore give bad result while other browser show it perfect.