3/11/11

Kenali code CSS dan ketahui dimana kedudukannya..


Selain join segmen jom kenal blogger rasanya blogger perlu juga berkenalan dengan code css..sebab code CSS ni memainkan banyak peranan.kalau mau cantikkan blog adalah WAJIB untuk mempelajari asas2 CSS...Jom berkenalan dengan code css dan ketahui di mana kedudukannya..penerangan ringkas ini berdasarkan dari template standard..

#header
Berapa pada atas sekali..tempat letak gambar header dan penerangan pasal blog anda..pada blog aku,aku buang code ni termasuk code html header sebab aku guna simple text header...kalau aku guna header gambar pun aku akan buang code ni..huhu

#outter  wrapper/ # content wrapper
Apa yang terkandung dalam outter wrapper@content wrapper ini ialah #mainwrapper dan #sidebarwrapper
jumlah panjang main wrapper dan sidebar wrapper mestilah lebih kecil berbanding content wrapper ni..kalau jumlah lebih besar maka sidebar tu akan jatuh ke bawah di tolak oleh main wrapper..

#main wrapper
area tempat isi kandungan entri anda..jika anda hendak besarkan lebarkan area ni,besarkan lebar outter wrapper atau kecilkan area sidebar..

#sidebar wrapper
sidebar ni tempat orang letak widget..x da lagi orang letak entri kat sini..memang boleh letak entri kat sidebar..tp pelik la..haha...kebanyakkan blogger menggunakan 1 sidebar..nak pindahkan sidebar dari kiri ke kanan,kanan ke kiri mudah saja.. cari code float:left(jika kiri ke  kanan) ubah kepada float : right..namun pada main wrapper anda perlu ubah sebaliknya...jika tidak pelik la jadinya...senangkan..

#footer
bahagian bawah sekali..aku letakkan widget yang berat pada area footer ni..supaya isi kandungan entri loading cepat sikit..kalau difikirkan secara logik..orang datang ke blog anda untuk membaca entri..bukan untuk tengok widget..
aku lebih suka guna footer 1 section saja..simple...

Info tambahan ;
Setiap area pada code css di atas anda boleh letakkan efek yang berlainan seperti warna background,warna tulisan dan macam2 lagi..

Gunakan layout jika anda mahu cuba2 terai nak blajar edit css..sebab CSS dia simple...jadi sangat la mudah dan senang mau edit..

Nama area pada code CSS tu anda boleh ubah tapi ia harus sama pada code html..cth
CSS=  #header  ...  HTML = <div id='header'>  (code CSS dan HTML yang asal)
CSS= #kepala   ...   HTML = <div id='kepala'> (code CSS dan HTML yang di edit oleh tukang edit tidak bertauliah..haahaha) nota: jangan pula anda ubah code CSS left kepada kiri..hehe..

Malas mau tulis entri panjang2 nanti x ada orang baca..jadi terima kasih la jika ada orang baca pasal info ringkas ni...

Sekian

7 ulasan:

NURUL ASHIKIN berkata...

masih x faham.. x pa saya akan baca lg

Polskahackrew berkata...

pelan2 kayuh.,kalau paham ni..baru blh edit template kaw kaw punya..thanks sudi singgah

Yastro berkata...

Aku nak lebarkan mainwrapper (tmpt entri blog) kene usik jugak ke side bbar tu??

Polskahackrew berkata...

YASTRO :

kena usik bro.. klu x sidebar tu akan jatuh ke bawah dia lepak atas footer..

cara paling senang guna lebar percent % .. contoh

#main-wrapper {width:70%;}
#sidebar-wrapper {width:30%;}

yang penting hasil tambah lebar tu 100%.. jangan lebih.. kurang x apa..

selamat menchobba

Yastro berkata...

Ok tenkiu bro...dr segi loading page x banyak kesan kan klau usik...yg lain2 x yah ke bro?? (just nk kepastian jerr)

Yastro berkata...

Takat ni lom jadik laie...dia jatuh atau dia lebih ketepi-kanan...nti aku cuba lagi bro...

Polskahackrew berkata...

YASTRO : x ada efek page loading bro.. ok.. blh atau tidak.. nnti bagi tau bro.. ('',)

entri ja

Related Posts Plugin for WordPress, Blogger...