Cara Membuat Footer 3 Kolom Dengan Background
Pada kesempatan kali ini saya akan menjelaskan cara Membuat Footer 3 Kolom Dengan Background, Baik saya akan memulai langkah-langkahnya
1. Login ke blogger dan masuk ke Dasbor.
2. Klik Rancangan, lalu pilih menu Edit HTML (Jangan Centang "Expand Template Widget")
3. Cari kode ]]></b:skin>
4. Letakkan kode CSS berikut ini diatas ]]></b:skin>
5.Cari Kode <!-- end content-wrapper --> dan letakkan kode dibawah ini tepat diatasnya
1. Login ke blogger dan masuk ke Dasbor.
2. Klik Rancangan, lalu pilih menu Edit HTML (Jangan Centang "Expand Template Widget")
3. Cari kode ]]></b:skin>
4. Letakkan kode CSS berikut ini diatas ]]></b:skin>
#footer-column-container {
clear:both;
}
.footer-column {
background:#444 url(http://i1237.photobucket.com/albums/ff473/muhammadsuteja/footerbawah.jpg) no-repeat; width:900px; position:relative; clear:both; margin:0 auto; float:left; padding:5px 0 10px 0; color:#fff
}
clear:both;
}
.footer-column {
background:#444 url(http://i1237.photobucket.com/albums/ff473/muhammadsuteja/footerbawah.jpg) no-repeat; width:900px; position:relative; clear:both; margin:0 auto; float:left; padding:5px 0 10px 0; color:#fff
}
5.Cari Kode <!-- end content-wrapper --> dan letakkan kode dibawah ini tepat diatasnya
<div id='footer-column-container'>
<div id='footer2' style='width: 30%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col1' preferred='yes' style='float:left;'/>
</div>
<div id='footer3' style='width: 40%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col2' preferred='yes' style='float:left;'/>
</div>
<div id='footer4' style='width: 30%; float: right; margin:0; text-align: left;'>
<b:section class='footer-column' id='col3' preferred='yes' style='float:right;'/>
</div>
</div>
<div id='footer2' style='width: 30%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col1' preferred='yes' style='float:left;'/>
</div>
<div id='footer3' style='width: 40%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col2' preferred='yes' style='float:left;'/>
</div>
<div id='footer4' style='width: 30%; float: right; margin:0; text-align: left;'>
<b:section class='footer-column' id='col3' preferred='yes' style='float:right;'/>
</div>
</div>
6.Simpan Template
Demikian pembahasan tentang Membuat Footer 3 Kolom Dengan Background ini kami sajikan, semoga bermanfaat.