Düzgün CSS Yapısı

RESET

Html elementlerine reset kodu ekleyerek elementlerin arasındaki boşluğu sıfırlayabilirsiniz. Reset kodunu Eric Meyer'in düzenlediği reset kodlarını kullanabilirsiniz. Yada alttaki kodu kullanarak ksıa bi yol izleeyebilirsiniz

* {
    margin: 0px;
    padding: 0px;
}

Fakat bu kodu kullnaırsanız input elementlerini resetleyemezsiniz

ALFABETİK SIRALAMA

Css kodlarını alfabetik sıralamada yaparsanız hem okuması rahat olur hem de daha sonra geri dönüp bakmak istediğinizde aradığınızı kolayca bulabilirsiniz.

#sample1 {
    margin: 0px;
    color: #000;
    background: #fff;
}

#sample2 {
    background: #fff;
    color: #000;
    margin: 0px;
}

Yukarı daki kodları okuduğunuzda eminim ikinci örnek daha anlaşılır gelmiştir.

İSKELET OLUŞTURMA

CSS kodlarınızı yazmadan önce hangi kodun nerede kullanılacağına dair yorumlar yapın. Mesela header elementleri için ayrı bir yer footer için ayrı side bar için ayrı bir yer olsun.

/*****Header*****/

Define all elements in the header

/*****Content*****/

Define all elements in the content area

/*****Footer*****/

Define all elements in the footer

/*****Etc*****/

Continue to define the other sections one by one

Daha detaylı bilgi için