Banner 468x60

Cara Membuat Banner 88x31 Auto Hide Di Fotter Dengan CSS

Cara Membuat Banner 88x31 Auto Hide Di Fotter Dengan CSS




Hallo Sobat Cyber Creative Kali Ini Gw Mau Post Tutorial
" Cara Membuat Banner 88x31 Auto Hide Di Fotter Dengan CSS "



Ok Langsung Aja Ke TKP:


  • Log In Ke Akun Blogger Kalian
  • Setelah Itu Buka Menu Template
  • Klik Edit HTML
  • Cari Kode ]]></b:skin> [Gunakan CTRL+F]
  • Letakan Kode Berikut Tepat Di Atas ]]></b:skin>



#Banner-Creative{margin-top: -11px;
margin-left: -2px;
width: 968px;
height: 28px;
margin-bottom: 10px;
text-align: center;
background: #ddd;
border: 3px solid#ff5600;
-webkit-transition: all 0.7s ease-in-out;
-moz-transition: all 0.7s ease-in-out;
overflow: hidden;
-webkit-box-shadow: 0px 0px 10px #ff5600;
-mox-box-shadow: 0px 0px 10px #ff5600;
-ms-box-shadow: 0px 0px 10px #ff5600;
-o-box-shadow: 0px 0px 10px #ff5600;
box-shadow: 0px 0px 10px #ff5600;}
#MZT-Blog-Banner h2{color: #ff5600;
font-family: nova square;
margin-bottom: 5px;
font-size: 16pt;
text-align: center;
border-bottom: 2px solid #ff5600;
height: 27px;
}
#Banner-Creative:hover{height:75px;}
#team{position:absolute;margin-left:280px;height:310px;width:210px;overflow:hidden;background:transparent;margin-top:-150px;}


  • Eitsss... Belum Selesai ,, Cari Kode <div id='footer-wrapper'>
  • Letakan Kode Berikut Tepat Di Atas Kode <div id='footer-wrapper'>

<div id='Banner-Creative'><h2>Banner Footer</h2><a href='http://cyber-cre4tive.blogspot.com'  
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIRwm4N2zH7HvdDRqwr20mAAgFDvTBRzil73OolwQvUPXwzGGbwIPolfH7U5xNeFpT2eb_wEup4uqw15qi7BOaP_lsFNEDCGlfBvCiijvk6j0Kkf6xsgfqD8Z3cUljYrl2b0gcIFI73ho/s1600/cyber-creative88.gif' border="0" width="88" height="31"  title='Cyber Creative | Creative Is Simple'></a><a href='http://cyber-cre4tive.blogspot.com'  

<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIRwm4N2zH7HvdDRqwr20mAAgFDvTBRzil73OolwQvUPXwzGGbwIPolfH7U5xNeFpT2eb_wEup4uqw15qi7BOaP_lsFNEDCGlfBvCiijvk6j0Kkf6xsgfqD8Z3cUljYrl2b0gcIFI73ho/s1600/cyber-creative88.gif' border="0" width="88" height="31"  title='Cyber Creative | Creative Is Simple'></a><a href='http://cyber-cre4tive.blogspot.com'  

<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIRwm4N2zH7HvdDRqwr20mAAgFDvTBRzil73OolwQvUPXwzGGbwIPolfH7U5xNeFpT2eb_wEup4uqw15qi7BOaP_lsFNEDCGlfBvCiijvk6j0Kkf6xsgfqD8Z3cUljYrl2b0gcIFI73ho/s1600/cyber-creative88.gif' border="0" width="88" height="31"  title='Cyber Creative | Creative Is Simple'></a><a href='http://cyber-cre4tive.blogspot.com'  

<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIRwm4N2zH7HvdDRqwr20mAAgFDvTBRzil73OolwQvUPXwzGGbwIPolfH7U5xNeFpT2eb_wEup4uqw15qi7BOaP_lsFNEDCGlfBvCiijvk6j0Kkf6xsgfqD8Z3cUljYrl2b0gcIFI73ho/s1600/cyber-creative88.gif' border="0" width="88" height="31"  title='Cyber Creative | Creative Is Simple'></a><a href='http://cyber-cre4tive.blogspot.com'  

<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIRwm4N2zH7HvdDRqwr20mAAgFDvTBRzil73OolwQvUPXwzGGbwIPolfH7U5xNeFpT2eb_wEup4uqw15qi7BOaP_lsFNEDCGlfBvCiijvk6j0Kkf6xsgfqD8Z3cUljYrl2b0gcIFI73ho/s1600/cyber-creative88.gif' border="0" width="88" height="31"  title='Cyber Creative | Creative Is Simple'></a><<a href='http://cyber-cre4tive.blogspot.com'  

<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIRwm4N2zH7HvdDRqwr20mAAgFDvTBRzil73OolwQvUPXwzGGbwIPolfH7U5xNeFpT2eb_wEup4uqw15qi7BOaP_lsFNEDCGlfBvCiijvk6j0Kkf6xsgfqD8Z3cUljYrl2b0gcIFI73ho/s1600/cyber-creative88.gif' border="0" width="88" height="31"  title='Cyber Creative | Creative Is Simple'></a><a href='http://cyber-cre4tive.blogspot.com'  

<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIRwm4N2zH7HvdDRqwr20mAAgFDvTBRzil73OolwQvUPXwzGGbwIPolfH7U5xNeFpT2eb_wEup4uqw15qi7BOaP_lsFNEDCGlfBvCiijvk6j0Kkf6xsgfqD8Z3cUljYrl2b0gcIFI73ho/s1600/cyber-creative88.gif' border="0" width="88" height="31"  title='Cyber Creative | Creative Is Simple'></a><a href='http://cyber-cre4tive.blogspot.com'  

<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIRwm4N2zH7HvdDRqwr20mAAgFDvTBRzil73OolwQvUPXwzGGbwIPolfH7U5xNeFpT2eb_wEup4uqw15qi7BOaP_lsFNEDCGlfBvCiijvk6j0Kkf6xsgfqD8Z3cUljYrl2b0gcIFI73ho/s1600/cyber-creative88.gif' border="0" width="88" height="31"  title='Cyber Creative | Creative Is Simple'></a><a href='http://cyber-cre4tive.blogspot.com'  

<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIRwm4N2zH7HvdDRqwr20mAAgFDvTBRzil73OolwQvUPXwzGGbwIPolfH7U5xNeFpT2eb_wEup4uqw15qi7BOaP_lsFNEDCGlfBvCiijvk6j0Kkf6xsgfqD8Z3cUljYrl2b0gcIFI73ho/s1600/cyber-creative88.gif' border="0" width="88" height="31"  title='Cyber Creative | Creative Is Simple'></a><a href='http://cyber-cre4tive.blogspot.com'  

<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgIRwm4N2zH7HvdDRqwr20mAAgFDvTBRzil73OolwQvUPXwzGGbwIPolfH7U5xNeFpT2eb_wEup4uqw15qi7BOaP_lsFNEDCGlfBvCiijvk6j0Kkf6xsgfqD8Z3cUljYrl2b0gcIFI73ho/s1600/cyber-creative88.gif' border="0" width="88" height="31"  title='Cyber Creative | Creative Is Simple'></a></div>


Nah Sekian Dulu Artikel Dari Cyber Creative
Jangan Lupa Tingalkan Comment nya 

14 komentar

gak ada screenshotnya ta mas jovi ???

Work Gan
Terima Kasih Yah Untuk Tutorial Nya

Sangat Bermanfaat Buat Para NewBie
Seperti Saya :D

Terima kasih banget ya tutorialnya

kgk ada..
tapi keren kok.. coba aja deh ;)

Gw Udah Pernah Coba
Tapi Habis Itu Gw Langsung Hapus Lagi
Karena Blog Gw Udah Sempit

nice post,nambah ilmu baru nih

Kenapa Udah Doble Comment nya -_-