Assalamualaikum....
Dah lama tak buat tutorial...Hari nie nak share tutorial dengan korang tab menu yg cute nie....tgk gambar di bawah
<style>.satu {border-radius: 10px 10px 10px 10px;width:30px;
padding:80px;
border: 3px solid #ffffff;
height:46px;
margin-top:-34px;
margin-left:25px;
background: #ffc0cb;
color:black;
font-size:12px;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
}
#dua {
position:fixed;
border-top:2px solid #ffffff;
border-bottom:2px solid #ffffff;
width:40px;
top:50px;
height:23px;
padding:1px;
text-align:center;
left: 0px;
font-size:10pt;
font-family:verdana;
background-color:#7F4E52;
color:transparent;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
}
#dua:hover {
left:-px;
}
</style>
<center><div id="dua"><div class="satu"></div>
<div style="margin-top: -200px; margin-left:70px;">
<img src='http://i985.photobucket.com/albums/ae340/ameliaaaaaaaa/sitewelcome.png'/>
-
<style>
.float {
cursor: url(http://www.ilona.com.br/blog01263.gif), progress;
background:#7f4e52;
border:3px solid white;
display:inline-block;
padding:6px;
width:80px;
margin:3px;
color:#fff;
font:8px short stack;
text-transform:uppercase;
letter-spacing:2PX;
text-align:center;
box-shadow:inset 0px 0px 0px #848484,inset 0px 0px 0px #848484;
-webkit-transition: 0.5s;
-moz-transition: 0.5s;
}
.float:hover {
color:#fff;cursor: url(http://media.tumblr.com/tumblr_m2umkqvNUT1qfamg6.gif),auto;box-shadow:inset 0px 14px 0px #ccc,inset 0px -14px 0px #ccc;}
</style>
<center>
<a href="http://hairuliza-anakku.blogspot.com/"><div class="float"><div id="left">Home</div></div>
<a href="https://www.blogger.com/home"><div class="float"><div id="left">Dashboard</div></div></a>
<a href="http://hairulizatutor.blogspot.com/2014/01/santai-tutorial.html"><div class="float"><div id="left">Tutorial</div></div>
</a><a href="http://hairuliza-anakku.blogspot.com/search/label/Tempahan"><div class="float"><div id="left">Tempahan</div></div></a>
</a></center></div></div></center>
Dah copy...Kalau dah Copy,paste jer kod tue dekat "html" kalau tak tahu ikut step di bawah...
Klik Layout,Add a Gadget pastu pilih
HTML/JavaScript paste jer kod kat dalam tue...pastu save...senang jer....korang cuma tukar warna dan url yg ada jer... |
1 comment:
menarik juga tab menu tu..
Post a Comment