Kutemukan satu gambar dengan ukuran, warna dan bentuk yang cocok untuk dijadikan banner di halaman blog.Perhatikan disini:
Namun sepertinya akan menjadi lebih banyak waktu yang dibutuhkan untuk meload semua banner kecil-kecil ini apabila linknya bertambah banyak (dan aku yakin ini sangat besar kemungkinan terjadi.)Jadi aku pikir kenapa tidak kotak ini aku jadikan background untuk banner saja,dan text di dalamnya saja yang berubah sesuai dengan keperluanya.
Untuk itu aku tutup aja bagian tulisan di dalamnya dengan warna putih #FFFFFF, dan hasilnya seperti berikut ini :
Ok, kita lanjutkan.Untuk itu aku perlu menyiapkan CSS style untuk itu, ini dia :
#banner {
letter-spacing:.1em;
float: left;
background: #D8DADC ;
margin:2px;
padding: 0px;
width:93px;
height:33px;
font:bold 95%/1em "Trebuchet MS",Trebuchet,Verdana,Sans-serif;
background:#ffffff url(http://photos1.blogger.com/blogger/4452/1518/1600/bgbutton.jpg) no-repeat;
}
Perhatikan Url gambar tersebut diupload di blogger pribadi agar lebih mudah dicari. (Tipsnya : kita bisa upload di satu post terpisah dalam status draft agar mudah dicari untuk di copy kode Urlnya suatu saat bila diperlukan). Lalu kita gunakan tag paragrap agar mudah mengendalikan posisi textnya ditengah, untuk itu ditambahkan dengan :
#banner p {
margin:0 15px;
color:#8c8639;
}
dan terakhir, karena sifatnya yang akan menjadi banner maka akan dipergunakan tag link.
#banner a {
text-decoration:none;
color:#8c8639;
}
ok, selanjutnya di dalam HTML akan kita tambahkan beberapa link banner.
hasilnya akan terlihat seperti banner kan?
Pengikut
2 komentar:
Kamu bisa dapetin ilustrasi wajah yang sesuai dengan wajah kamu di moselo.com/Bikingemeys. Jangan lupa ada promo jika pesan dari aplikasinya langsung.
Langganan:
Posting Komentar (Atom)
Postingan Populer
-
Nokia Indonesia merilis varian Asha terbaru. Seri untuk kelas bawah ini hadir dengan sentuhan baru. Terutama dari segi kemudahan berbagi fil...
-
Setelah kita memiliki blog tentu yang perlu dilakukan selanjutnya adalah mengelola dan mempublikasinya. Mengelola berarti selalu melakukan p...
-
Seakan diingatkan oleh Mbak Hanan karena di blog saya belum pernah menulis tentang bagaimana membuat link read more disetiap postingan blog...
ass pak
BalasHapuspak maaf saya mw tanya …
bagimana cara edit css DATE yang seperti ini
div class=’date’>
var timestamp = "";
if (timestamp != '') {
var timesplit = timestamp.split(",");
var date_yyyy = timesplit[2];
var timesplit = timesplit[1].split(" ");
var date_dd = timesplit[2];
var date_mmm = timesplit[1].substring(0, 3);
}
document.write(date_mmm);
document.write(date_dd);
saya sudah coba, tapi gagal aja pak
please replay in my email dillangek.ngok@yahoo.com
ditunggu ya pak
terimaksih
wassallam
wallaikumsalam.
BalasHapusngedit CSSnya buat apa nih, saya blum cek, apakah ini maksudnya biar CSSnya jalan, atau mau ngedit biar tampilannya lain, boleh diperjelas?