P0L5K4H4CkR3W | Blogger Blog Tutorial | Tutorial blogspot | Blogger tutorial for blogspot | Simple coding tutorial | Blog tutorial untuk blogspot | Panduan untuk Blogger
12/12/11
Tutorial cara buat border pada widget sidebar
Tutorial cara buat border pada sidebar ni adalah atas request dari CikBunnyHomei
Untuk buat border pada widget ni kita akan bermain dengan coding CSS..
Mula2 pergi ke desbot---desaign---edit HTML...jangan tick pada expand widget template...
cari code
]]></b:skin>
kemudian masukkan code di bawah di atas code yang dicari
.sidebar .widget {border-radius:15px;border:3px dashed #ff3366;}
cth
.sidebar .widget {border-radius:15px;border:3px dashed #ff3366;}
]]></b:skin>
penerangan code..
border-radius:15px; -untuk membuat round corner pada widget tu
border:3px dashed #ff3366; - 3px tebal border,dashed jenis border putus2,#ff3366 ialah code warna(pink)
jenis border boleh rujuk pada code tutorial
KLIK SINI UNTUK J3N1S B0RD3R
jika anda mahu tambah warna background pada widget tu..tambahkan code
background:#151515;
COntoh
.sidebar .widget {border-radius:15px;border:3px dashed #ff3366;background:#151515;}
dalam entri tutorial ni aku sertakan live demo code yang aku bagi tu..aku guna code css yang ada background..
seperti yang aku terangkan tadi.. rounded corner pada widget,border putus2,border warna pink..dan background kaler kelabu gelap
anda boleh tengok live demo pada sidebar entri ni...
Jenis2 border yang biasa digunakan..
solid
dashed
dotted
code warna RUJUK SINI
Sekian
Langgan:
Catat Ulasan (Atom)
7 ulasan:
awak, ada tak tuto cara nak buat ayat bergerak sebaris sebaris dalam satu border?
oke saya dah tengok sampel tue...yup macam tue yg saya nak...sebab saya nak buat kotak untuk 1 hari 1 ayat renungan.. sebab takut ada ayat yg pjg sebab tue minta ayat bergerak sebaris2...
@far_east
ok da siap nnti sy habaq..('',)
Tutorial ni mnjadi la.Thanks.
@Nurul Anisah
ur welcome.. thanks bg feedback..('',)
thanks untuk ilmu ni. Dh buat n jadi! Berganda pahala.. =)
terima kasih . menjadi . klik mr.nuff tanda upah :D
Catat Ulasan