Creating a Simple Button for Demo

This is the result:



And the code for this is:
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"

Popular posts from this blog

Set table width to 100% on PDF export in Datatables

Add/Subtract Single Digit Number in Assembly Language