Ini adalah
bagian 4 dari tulisan saya yang berjudul
Tutorial HTML5 CSS3, langsung saja ya..
Langsung isi code berikut di dalam tag
<footer>
<p>
Design By Megahnanda Bintang M.<br>
2013 Megahnanda
</p>
Very-very simple.. dan ini hasilnya:
Lho,,, kok sudah ditaruh di
Footer kok malah ada di tengah2 gitu?? diam saja kau,, waktunya
CSS :D
footer{
clear: both;
width: 900px;
background-image: url(images/footer-loop.png);
background-position: top left;
background-repeat: repeat-x;
margin: 0 auto;
padding-top: 27px;
padding-bottom: 27px;
}
kita kasih
Clear:both, agar pengaruh dari
Float left dan right di atasnya menjadi netral. pada
Footer ini juga kita kasih efek
gambar Not yang diulang-ulang secara horizontal (repeat-x).
footer p{
font-family: arial;
font-size: 11px;
font-style: italic;
background-image: url(images/logo-footer.png);
background-position: center right;
background-repeat: no-repeat;
line-height: 16px;
}
di sini kita hanya memberi efek background image berisi logo yang terletak
di sisi kanan.
Dan hasilnya harus seperti pada
video di bawah ini:
Nah sampai di sini saja
Tutorial HTML5 CSS3 dari saya, silakan dikomentari, semoga bermanfaat, terima kasih, wassalam..
Artikel keren lainnya yang WAJIB dibaca:
