Web Design Tips: Menggunakan CSS Reset
Penulis sendiri awalnya memang seperti itu, memang merepotkan. Tapi belakangan penggunaan CSS Reseter semakin populer digunakan, karena fungsinya sama baiknya dengan menggunakan file file yang berisi style yang berbeda menyesuaikan dengan browsernya. Dalam teknik pencocokan style, ketika user menggunakan internet explorer maka style yang digunakan pun biasanya dinamakan dengan ie.css, jika user menggunakan firefox maka style yang digunakan biasanya dinamakan dengan default.css, dan lain-lain sebagainya, dalam teknik css reset, kita cukup menggunakan satu buah file css saja, namun di tambahkan dengan barisan kode yang dapat mereset kondisi css, sehingga browser tidak memiliki nilai default dari style-style yang ada. Alias 0 (null).
Berikut adalah css reset yang biasa saya gunakan :
/* RESET */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
height: auto;
border-top-width: 0;
border-bottom-width: 0;
border-left-width: 0;
}
blockquote:before, blockquote:after,q:before, q:after {content: ”;content: none;}
blockquote, q {quotes: none;}
:focus {outline: 0;}
.clear {clear: both;display: block;height: 1px;overflow: hidden;margin: 0;padding: 0;}
ins {text-decoration: none;}
del {text-decoration: line-through;}
table {border-collapse: collapse;border-spacing: 0;}
ol, ul {list-style: none;}
body {background-color: white;background-position: center center;}
/* RESET */
Sebenarnya ada beberapa teknik reset yang digunakan, tapi penulis sendiri cenderung menggunakan css reset yang di atas. Anda tidak lagi direpotkan oleh perbedaan tampilan layout antara Internet Explorer dengan Mozilla Firefox atau yang lainnya. Sehingga hasilnya nanti tampilan css di firefox juga mirip dengan tampilan menggunakan browser internet yang lain. Selamat Mencoba.
sumber
Penulis sendiri awalnya memang seperti itu, memang merepotkan. Tapi belakangan penggunaan CSS Reseter semakin populer digunakan, karena fungsinya sama baiknya dengan menggunakan file file yang berisi style yang berbeda menyesuaikan dengan browsernya. Dalam teknik pencocokan style, ketika user menggunakan internet explorer maka style yang digunakan pun biasanya dinamakan dengan ie.css, jika user menggunakan firefox maka style yang digunakan biasanya dinamakan dengan default.css, dan lain-lain sebagainya, dalam teknik css reset, kita cukup menggunakan satu buah file css saja, namun di tambahkan dengan barisan kode yang dapat mereset kondisi css, sehingga browser tidak memiliki nilai default dari style-style yang ada. Alias 0 (null).
Berikut adalah css reset yang biasa saya gunakan :
/* RESET */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
height: auto;
border-top-width: 0;
border-bottom-width: 0;
border-left-width: 0;
}
blockquote:before, blockquote:after,q:before, q:after {content: ”;content: none;}
blockquote, q {quotes: none;}
:focus {outline: 0;}
.clear {clear: both;display: block;height: 1px;overflow: hidden;margin: 0;padding: 0;}
ins {text-decoration: none;}
del {text-decoration: line-through;}
table {border-collapse: collapse;border-spacing: 0;}
ol, ul {list-style: none;}
body {background-color: white;background-position: center center;}
/* RESET */
Sebenarnya ada beberapa teknik reset yang digunakan, tapi penulis sendiri cenderung menggunakan css reset yang di atas. Anda tidak lagi direpotkan oleh perbedaan tampilan layout antara Internet Explorer dengan Mozilla Firefox atau yang lainnya. Sehingga hasilnya nanti tampilan css di firefox juga mirip dengan tampilan menggunakan browser internet yang lain. Selamat Mencoba.
sumber