How To Create Button From HTML Coding


<input type=”button”>

In this post I will show you how to create HTML button link with onclick and use href link button, and also we are using CSS code for different colors and sizes.


1.HTML Button Code

<form>
<input onclick="window.location.href='http://www.kamalgrd.com'" type="button" value="Put Your Text Here" />

</form>

Output



While this method is easy because it has minimal code, the button looks a bit plain. It is possible however to make great looking hyperlink buttons by adding CSS code. Keep scrolling to see examples.

2.Link Button Inline CSS Styling Code

<form>
<input style="width: 300px; padding: 20px; cursor: pointer; box-shadow: 6px 6px 5px; #999; -webkit-box-shadow: 6px 6px 5px #999; -moz-box-shadow: 6px 6px 5px #999; font-weight: bold; background: #ffff00; color: #000; border-radius: 10px; border: 1px solid #999; font-size: 150%;" type="button" value="Put Your Text Here" onclick="window.location.href='http://www.kamalgrd.com'" />


</form>

Output



3.Button Link Internal Stylesheet

HTML Code :- 

<form>
<input class="MyButton" type="button" value="Your Text Here" onclick="window.location.href='http://www.kamalgrd.com'" />
</form>

CSS Code :- 
<head>
<style>
input.MyButton {
width: 300px;
padding: 20px;
cursor: pointer;
font-weight: bold;
font-size: 150%;
background: #3366cc;
color: #fff;
border: 1px solid #3366cc;
border-radius: 10px;
}
input.MyButton:hover {
color: #ffff00;
background: #000;
border: 1px solid #fff;
}
</style>
</head>

Output 







I hope will you understand in any problem then watch this video till the end.


Thank You So Much

How To Create Button From HTML Coding How To Create Button From HTML Coding Reviewed by K Khan on 12:51:00 PM Rating: 5

2 comments:

  1. First of all congratulations on this post. This is really awesome. Great posts that we can sink our teeth into and really go to work. Your blog post is decent and meaningful for new users. A title is very unique and content is powerful to attract the audience directly. Continue to write this type of article in the future for us.
    Bollywood Tracks Lyrics

    ReplyDelete

Powered by Blogger.