-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
34 lines (33 loc) · 2.18 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<html>
<head>
<title>Ghost Button Tutorial - ProgrammingGuide.in</title>
<link rel="shortcut icon" href="http://programmingguide.in/wp-content/uploads/2012/11/pg_favicon_new.png" type="image/png">
<link rel="stylesheet" type="text/css" href="style.css">
<link rel="stylesheet" type="text/css" href="http://programmingguide.in/My_Files/font-awesome-4.0.0/css/font-awesome.min.css">
</head>
<body>
<div class="pg-top">
<img title="ProgrammingGuide" class="pg_logo" src="pg_svg.svg" />
<span> <i class='fa fa-play'></i><a href="#">Ghost Buttons</a> </span>
<div style="float: right; margin-right: 15px;">
<span> <a href="http://programmingguide.in/2013/11/two-color-stylish-text-field/"> <i class='fa fa-backward'></i>Back to Article </a></span>
<span> <a href="http://programmingguide.in/category/CSS/"> <i class='fa fa-list-alt'></i>More CSS Tuts </a></span>
<img title="humanz" class="humanz_logo" src="humanz_pg_svg.svg" />
</div>
</div>
<center>
<h1>GHOST BUTTONS</h1>
<p>They do looks cool ?</p>
<br><br><br>
<p id="para">"GHOST" BUTTONS! Ever wondered why are these called so? Because these buttons blends completely and into webpages just like ghosts. These can also be called as "EMPTY", "NAKED", "HOLLOW" buttons. These buttons have a transparent background with a border that <br>makes it look like a button. Lets see how it looks!<br><br>(Hover over the button)</p>
<br><br>
<div id="gbutton1">
<a href="#">GHOST BUTTON</a>
</div>
<footer>
<p class="p_footer"><a href="http://facebook.com/ProgrammingGuide" target="_blank"><i id="social" class="fa fa-facebook-square"></i></a> <a href="http://twitter.com/Program_Guide" target="_blank"><i id="social" class="fa fa-twitter-square"></i></a> <a href="http://feeds.feedburner.com/Programming_Guide" target="_blank"><i id="social" class="fa fa-rss-square"></i></a></p><br>
<p class="p_footer">© 2014. <a href="http://programmingguide.in">ProgrammingGuide.in</a> | humanz</p>
</footer>
</center>
</body>
</html>