RESET CSS NEDİR? BİZE SAĞLADIĞI FAYDALAR NELERDİR ?
Reset css,projelerimizde kodlama yaparken kenarda köşede gereksiz boşlukları kaldıran ve kod yapımıza etki eden tüm html taglarını sıfırlar.Yani sayfamızı tamamen tüm tarayıcılar için default (varsayılan) hale dönüştürür.
PEKİ BİR RESET CSS NASIL HAZIRLANIR ?
Aslında html/css bilgimiz varsa hepimiz bir reset css yazabiliriz fakat buna hiç gerek yok çünkü profesyonel kişiler tarafınca hazırlanan reset css'ler mevcut özellikle benim bu konumda belirteceğim ve kodlarını paylaşacağım kişi Eric Meyer'dir.Benimde hemen hemen çoğu projelerimde kullandığım Eric Meyer'in reset css'i yeni bir projeye başlamadan önce dosyalarımıza dahil etmemiz gereken bir yapıdır.
RESET CSS NASIL KULLANILIR ?
Aşağıdaki kodları kopyalayıp reset.css olarak kaydedip sayfanıza dahil edebilirsiniz.
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, 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, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } /* HTML5 display-role reset for older browsers */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; }
Yada buraya tıklayarak direkt olarak dosyayı indirebilirsiniz.
NOT
Reset CSS Projeye sonradan dahil edilerek kullanılmaz.Aksi taktirde sitenizin yapısının tamamen bozulması kaçınılmazdır.Reset CSS'den en iyi şekilde faydalanmak için sıfırdan projeye başlarken dahil etmemiz gerekmektedir.
ÖNEMLİ BİLGİ !
Reset CSS'i incelediyseniz Normalize.css'i kesinlikle incelemenizi öneririm.
Erkan ÜNLÜTÜRK
7 yıl önceo halde neden siz normalize.css kullanıyorsunuz?
Emre Ceyhan | Admin
7 yıl önceResponsive css framework olan bootstrap'i kullanıyorum oda kendi sisteminde normalize.css'i kullanıyor.Normalize.css hakkında ki yazımı buradan inceleyebilirsiniz.
Yavuz Selim Kısmetli
6 yıl önceTeşekkürler hocam, faydalı bir yazı olmuş.
eren
6 yıl öncemerhabalar bu değerli yazınız için çok teşekkür ederim
Hakan
5 yıl öncePeki reset.css meyerweb ile normalize aynı anda kullanılır mı? Ne gibi faydası olur?
Emre Ceyhan | Admin
5 yıl önceAynı anda kullanılması tamamen gereksiz.