Creating a Simple Button for Demo
This is the result:
And the code for this is:
You can customize the background, font and color on the "a.demo"
For CSS Mark-Up, Paste is before ]]></b:skin>
a.demo{
background:skyblue;
padding:5px 20px 5px 20px;
text-align:center;
font-family: Arial;
font-size:18px;
border:#e1e1e1 1px solid;
-webkit-box-shadow: 0 8px 6px -6px black;
-moz-box-shadow: 0 8px 6px -6px black;
box-shadow: 0 8px 6px -6px black;
color:#e1e1e1;
}
a:link.demo,a:visited.demo{
text-decoration:none;
}
a:active.demo {text-decoration: none;color:gray;padding:4px 20px 4px 20px;}
a:hover.demo {text-decoration: none;box-shadow:none; }
and this is how we use it.
For HTML Mark-Up
<a class="demo" href="LINK OF THE PAGE HERE" title="see it live">Live Demo</a>Every time we use this button just define the link by putting "class="demo"" just like the above example.
You can customize the background, font and color on the "a.demo"
Comments
Post a Comment
Feel free to ask, suggest and comment regarding this post/blog. You can also contact me through e-mail, just always use the contact page. Thank you for visiting this blog.