Wednesday, November 16, 2011

How to Create Image on Button


Would you like to create a button like the left button with an image?

You can do it with just HTML code without any javascript or so ever...Copy the code below..

<button type="button" name="login_button" class="button"><img src="images/lock.png" width="15" height="15" border="0" />&nbsp;Login</button>

The button will look like this...


So, if you like to have a button just like mine, you got to have the css style for this button.

.button{background:url(images/button.png) no-repeat 0 0;width:80px;height:34px;border:none;color:#fff;cursor:pointer;text-align:center;line-height:34px;font-weight: bold;}

And now the last path is the image, save this image (below) in the location that your file can reach it.




Hope you manage to do it...

LinkWithin

Related Posts Plugin for WordPress, Blogger...