Mengubah Background Blog

*Mengubah Warna Background

Sobat bisa bersenang-senang dengan warna untuk mengganti warna background. Gunakan search engine untuk menemukan code warna. Biasanya code warna berbentu seperti ini (contoh hitam; #000000, putih; #FFFFFF). Misalnya warna akan diganti dengan merah; #FF0000, ganti code diatas menjadi:


    body {
    background-color:#FF0000;

Kalau cuma pingin sidebar aja yang warnanya ganti, tambahkan code ini:

    #sidebar-wrapper {
    background-color:#FF0000;

Atau kalau ingin memberikan warna yang berbeda pada kolom utama, tambahkan code ini:

    #main-wrapper {
    background-color:#FF0000;

Catatan, beberapa template mungkin akan mempunyai nama berbeda pada tiap codenya, contoh pada #sidebar-wrapper nama akan menjadi #side-wrap, dsb.

*Menambahkan Background Gambar


Kode yang harus dimasukkan adalah:

    body {
    background-image:url(URL GAMBAR);

URL gambar adalah url yang diberikan oleh hosting service untuk meload gambar. Jika menggunakan jasa hosting dari photobucket.com maka URL akan tampak seperti ini; http://i380.photobucket.com/albums/oo242/clickeap/bssbaabadge.gif


Masukkan url kedalam tanda kurung, lalu klik preview untuk melihat hasilnya.



Untuk sidebar:

    #sidebar-wrapper {
    background-image:url(URL GAMBAR);


Untuk meletakkan gambar hanya pada kolom utama saja:

    #main-wrapper {
    background-image:url(URL GAMBAR);


*Code Tambahan


Secara default, gambar akan menjadi berulang (repeat) untuk memenuhi background dengan gambar. Tapi kalau sobat ga mau seperti itu, tambahin aja code ini:

    background-repeat: no-repeat;

Atau cuma berulang di bagian horizontal aja (x line):

    background-repeat: repeat-x;

Kalau berulang di vertical (y line):

    background-repeat: repeat-y;

*Posisi

Untuk posisi, ada beberapa pilihan yang bisa digunakan:

    * top center;
    * top right;
    * center left;
    * center center;
    * center right;
    * bottom left;
    * bottom center;
    * bottom right;

Pengaplikasiannya;

    background-position: top left;

Atau kalau tetap ngerasa ga cocok ama posisi yang sudah ada, bisa diganti dengan menggunakan pixel atau persentase.

    x% y%;

    xpx ypx;

Aplikasinya:


    background-position: 20px 30px;

Untuk membuat background menjadi diam, terkunci, statis, maka perlu ditambahin kode ini:


    background-attachment: fixed;

Semoga tutorial ini bisa membatu para pecinta Blog untuk memperkaya blognya! Hidup blog Indoesia!

( sumber :  http://www.dindingcoret.com/2010/02/cara-membuat-background-blog.html )