Thursday, September 13, 2007

Tutorial CSS, Background di Header

Anda ingin menambahkan image atau gambar di header blog?
Header berupa gambar indah di lihat, dan menjadikan blog atau web jadi meriah. Ada dua cara memasang gambar, satu dengan langsung di taruh, dengan tag IMG, atau dijadikan latar belakang.

Untuk menambah latar belakan image pada header lakukanlah hal sebagai berikut:
pada css style, buat properties untuk header
misalnya:
#header
{
padding:10px;
background-image:url( alamat file );
background-repeat:no repeat;
}
Perhatikan, ukuran file gambar, kalau ingin pas dengan halaman yang sudah didesain, sesuaikan ukuran gambar dengan properties #header.

/*kalau ukuran gambar lebih kecil dari div header, dengan propertie background-repeat:no repeat, maka hanya akan terlihat satu gambar saja, seperti perintah IMG. Kalau ukuran gambar sama dengan ukuran div #header, properties background-repeat tak diperlukan.

Nah, di atas gambar kita bisa menulis seperti biasanya. Tulisan di atas gambar.

posisi SERP google no 3 untuk pencarian dengan kata kunci:"tutorial CSS"

8 comments:

Anonymous said...

kalo pengen di tengah gimana ya

meds said...

kalau pengin di tengah, coba pake properties berikut:

...
background-position:center;
background-repeat:no-repeat;

Anonymous said...

kalau biar tiap sudutnya rounded gmn mas oerintahnya? Thanks

Anonymous said...

sry nih newbie
cara manggil code css di html nya gmn ya?

Anonymous said...

Wah matur nuwun banget mazz :)
Mo di coba ah...

Anonymous said...

Oh ya kalo ada dua gambar dan ingin sedikit agak transparant (pakai css) digambar yang depan gimana ya mazz
Asyik kayaknya :)
matur nuwun

meds said...

Sory pada telat mbalas. Untuk sudut rounded/ rounded corner, saya tahunya pake image, bikin tiga bagian untuk 3 div. Atas berupa tampilan round atas, tengah berupa garis tepi, bawah berupa rounded bawah (sisi kiri-kanan bawah).

Untuk mbak arohwany, Untuk gambar transparent, mohon maaf saya belum bisa. Nanti kalau sudah, saya posting.

Untuk Rully, untuk naruh kode css ada dua macam, di dokumen diantara style, atau di file tersendiri kemudian di link rel ...css.

untuk manggil tinggal pasang di propertis: mis: div class="hurufbesar", atau p class="kapital"

semoga membantu

Mr. X said...

ikutan komentar ya/ salam kenal...