BloonOnline GoTemplatez VersiEdan
Facebook Twitter You Tube Friendfeed
Blog Seo Intermezo

Global Css Reset

Menyeragamkan Ukuran Pada Setiap Browser.

globa reset Dalam tulisan tentang “ memasang linklist ala msn “ atau “ membelah komentar menjadi dua kolom “. saya menyarankan untuk memasukan kode css seperti ini.

*  { padding: 0;margin: 0; }

Dan sampai sekarang-pun setiap saya memodifikasi template, saya selalu mengawali css-nya dengan tag tersebut. Untuk apa tujuannya ??

Perlu kita ketahui setiap browser  mempunyai value ( nilai = pixel , persen dll ) yang berbeda-beda . seperti untuk tag  heading <h> , list <ul> dll. maka salah satu solusi -nya ialah saya selalu memberikan sebuh tag css di atas, yang sering di sebut “ global reset “, yakni mereset nilai padding dan margin untuk semua browser menjadi = 0 ( nol ).

Oh tentu saja jika kita memasukan tag css global reset  tersebut pada sebuah template yang sudah jadi , maka yang perlu kita lakukan mengatur ulang nilai margin dan padding pada tag-tag yang kita lihat berubah.

Contoh lain dari Global Reset.

* { outline: 0; padding: 0; margin: 0; border: 0; }

Yahoo Css Reset

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { padding: 0; margin: 0; } table { border-collapse: collapse; border-spacing: 0; } fieldset,img { border: 0; } address,caption,cite,code,dfn,em,strong,th,var { font-weight: normal; font-style: normal; } ol,ul { list-style: none; } caption,th { text-align: left; } h1,h2,h3,h4,h5,h6 { font-weight: normal; font-size: 100%; } q:before,q:after { content:''; } abbr,acronym { border: 0; }

Contoh template yang sering mengunakan global reset bisa kita lihat pada Theme-nya Wordpress, Template blogspot keluaran BlogAndWeb atau themerious dll.

blog cat

Technorati tags: , , ,

Related Link.

1. a-killer-collection-of-global-css-reset-styles 

2. reser-reloaded – eric’s

3. Global White Space Reset

4. css tip global reset


tweety-02 (Custom) Download Minima Cigazine Template

Makacih atas kunjugan dan supportnya selama ini

Page views this post: reader

34 komentar:

JoVie said...

Pertamaxxx.....
Wah..lengkap banget infonya Kang...

Btw, terus, gimana tuh cara membelah tulisan di posting menjadi 2 kolom seperti yang biasa ada di post Kang Jaloee....

Mohon pencerahannya yah Kang....

Salam,
===========
*agak normal nih komentarnya..:D*

Jaloee said...

@ Jovie

wakakak.. iya neh , jangan2 salah makan..

oh itu kan udah sy posting di sini ..

Unknown said...

Kang, Jovie cuman nitip absen bangkunya aja kosong. jadi saya yang mestinya pertamax. dia kedua aja. alias minyaktanaxx.

*mode merhatiin kuliahnya suhu Jaloe..sedang tak on-in....

Jaloee said...

@ Gus

wakakak.. datangnya barengan yach suhu.. tumben akur ??

Anonymous said...

Waduh puyeeeeng kang, ga ngerti emang deh saya.

Anonymous said...

mampir belajar ama suhu jaloe akhhh..wah..ga ikutan ribut deh..hehehehe..

ilmu baru terus nie...sippp..sippp...

Anonymous said...

aku anak kecil...ehmmmm, gag ngerti juga, itu buat apa kang?.....

Kristina Dian Safitry said...

o..begitu ya kang. daku jadi inget nih, mau nanya sesuatu yg ada hubunganya dengan form komen. sejak tak ubah jadi seperti yang sekarang ini nih, kok sering muncul pesan: stop skrip. apa maksudna ya? apakah ada hubunganya dengan tulisan diatas?

Anonymous said...

Wekekekeke....
Ilmuu lomnyampe nech kayaknya....

Anonymous said...

Waduh masih puyeng. Ntar baca lagi.mas. Tapi keren nih infonya.

sawa (tukang sapu radio) said...

he.. he.. he.. lum kajian ane nich...

Anonymous said...

jaaah ketinggalaana,.., tapi masih masuk top teen,..

Anasku said...

iya mas... ini sololusinya makasih.. karena setiap saya buat template pasti saya optimazikan ke beberapa browser.. bukan cuma satu browswerr.. dan pasti orang kan menggunakan browser yg beda2

Anonymous said...

Bagus dan lengkap kang tutorialnya.....


Tapi saya gak ngerti... ;D

Syamsul Alam said...

Hihihihihi.... jadi gitu to gunanya... Thx to mas Anasku....

Jadi, biar tampilan di semua browser sama kan? betul gitu kan? Saya ga salah kan? Kalo salah, minta maaf lagi, deh... tehehehehe......

ipam nugroho said...

ilmunya tambah atu..makacih suhu..he..he

Subagya said...

ho ho ho pantesan harus di rubah lagi yak setiap nilainya yang kena global css reset ini.. kenapa ga bilang dari dulu kang ... wekekekekeke ampe pusing saya ngurusin tag ul yang menjorok ke kiri ternyata kena dampak penambahan ini toh.. sip ...

Unknown said...

Ooo begitu toh ceritanya...
Baru tahu ane mah.
Pantesan kalo ane belajar css itu, sering belepotan kalo di buka beda browser. jadi bingung deh waktu itu. :D

Terima kasih bang.

Anonymous said...

Aku baru tahu ... ternyata itu toh fungsinya ... kalo "outline: 0;" artinya atau fungsinya untuk apa kang ???

Maaf baru bisa berkunjung ... :)

Anthony Harman said...

kang, membelah komentar jadi dua kolom apa ada contohnya?

—¤(rIDa)¤— said...

@ Anthony Harman : contohnya, ya kolom komentar punya kang jaloe ini. kolom pertama dipake untuk media penyimpanan nama dan photo komentator, dan klom kedua dipake untuk media penyimpanan teks comment. bukan begitu kang jaloe..??
jaloee: BUKAN..!!

Jaloee said...

@ k Dian s..

kayaknya ngga ada hubunganya

@ Gratisan

itu bisa untuk border

@ Mas Anthony

itu dah di jawab oleh rida

slamet sugiarto said...

yup....ini ilmu lagi. Makasih bos...

Anonymous said...

wah puyeng ntar aja deh nyobainnya :P

Anonymous said...

outline tuh untuk border ya ... terkadang aku liat (misalnya web aku di http://gratisan.110mb.com) antara browser yg satu dengan yg lain tidak sama dan terkadang tampilannya tambah ancur ... kalo hal itu kenapa ya kang???

Anonymous said...

Wah harus baca artikel sebelumnya nih, kayanya mau pasng nih disalah satu blog saya...coolll

Unknown said...

Iya Kang,saya ngerti dikit...he,he,
Terimakasih Kang udah bagi-baGi eLmu CSS nya...
tengkyu daH pokoknya....

Fitriansyah said...

kang blog saya kadang kl dibuka di laen kompi pake IE jadi berantakan, pdhl sama2 IE knapa ya? apa karna beda Resolusi Monitor? tp kl mozilla aman2 aj, mohon penjelasan..

Jaloee said...

@ indo trans

coba lihat versi ie-nya mas.. karena ie 7 dan ie 6 berbeda dalam mebaca Css..

kalau versinya sama berarti ada yg keliru dgn kodenya..

Anonymous said...

Mantab.. tutorialnya mas jalooe. Tapi saya masih bingung dikit......maklumlah newbie

Project said...

coding nya itu loh,bikin pusing

Anang said...

wah ini penting biar tampilannya jadi sama tiap browser ya

JoVie said...

ok deh Maturnuuwun Kang Jaloe...langsung saya cek deh nanti....
skrg lagi di perpus cum amampir bentar..mumpung ada komputer nganggur..:D

Mizake said...

Bang Jaloe
Terima kasih untuk telah mensejajarkan Themerious dengan BlogOhBlog walaupun sebenarnya ini mungkin terlalu berlebihan.

Ohya FYI, reset CSS sebenarnya saya lakukan karena mengikuti style aslinya saja. Dan juga karena style default Blogger sangat memusingkan (bisa-bisa mata belo). So, cara gampang say ambil dengan mengikuti style default css bawaan template bersangkutan ketika mengkonvertnya ke blogger platform.

Btw, tolong dikoreksi link themerious di atas bukan lagi dengan eks. domain co.cc (coz co.cc domain service kayana penipu bangat) saya dah pulangin ke default sub domaian blogspot.

Makasih
Salam blogging

Mizake

Post a Comment

" Apapun Yang Dapat Anda Lakukan, Atau Ingin Anda Lakukan Mulailah

Keberanian Memiliki Kecerdasan, Kekuatan Dan Keajaiban Di Dalam-nya"

Makacih Atas Komentar-Nya

 

Copyright 2009. Home | Serba Serbi Google | XHTML | CSS Design by Catalog-Tutorial