Olmazsa Olmaz Serisi No:1 – Otomatik Tamamlama makalem ile OOS’ye başlamıştım. İlk olmazsa olmazımız otomatik tamamalama özelliğine sahip bir arama kutucuğu geliyordu. Serimizin ikinci gerekli malzemesi ise bir çok yerde belki de duyup ne olduğunu çözemediğiniz “Reset CSS”!

Reset CSS Nedir?
Bir CSS tekniği diyebileceğimiz CSS Reset ile IE, Mozilla, Safari vb. tarayıcılarda öntanımlı olarak gelen bazı padding, margin, h1, h2, h3 tarzı verileri sıfırlayarak yazacağımız css kodunun her tarayıcıda aynı şekilde görünmesini sağlar. Bu kod bütününü CSS dosyanızın başına koyarak sitenize eklerse

Başlıyoruz…İlk adım Margin ve Padding’leri sıfırlamak

body, html, div, blockquote, img, label, p, h1, h2, h3, h4, h5, h6, pre, ul, ol, li, dl, dt, dd, form, a, fieldset, input, th, td
{
margin: 0; padding: 0; border: 0; outline: none;
}

Elemanlara Hükmedelim

body
{
line-height: 1;
font-size: 88%;
}

h1, h2, h3, h4, h5, h6
{
font-size: 100%;
padding: .6em 0;
margin: 0 15px;
}

ul, ol
{
list-style: none;
}

img
{
border: 0;
}

Birkaç özel gerekli float bilgisi koyalım

.floatLeft
{
float: left;
padding: .5em .5em .5em 0;
}

.floatRight
{
float: right;
padding: .5em 0 .5em .5em;
}

İşte bu kadar basit. Floatları ayarlarken uygun float sınıflarını kullanırsanız sayfanızda bir standart olur.
Dİpnot: Makalede Nettuts’un Create Your own Simple Reset CSS yazısından derleme yaptım. Kodlar da buradan alınmıştır.

Kaynak Kod

About these ads