Reset CSS Nedir? Nasıl Kullanılır?  Reset CSS Nedir? Nasıl Kullanılır? | Googleda Görüntüle

Reset CSS Nedir? Nasıl Kullanılır?
 BEĞEN
  YORUM YAP

WallpaperPlay | Ücretsiz HD Masaüstü ve Mobil Wallpaper Duvar Kağıdı

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.

Etiketler

Yorumlar

Bu Konuya Ait 4 Onaylı Yorum Bulunuyor.

Erkan ÜNLÜTÜRK

Erkan ÜNLÜTÜRK

  1 yıl önce

o halde neden siz normalize.css kullanıyorsunuz?

Emre Ceyhan

Emre Ceyhan | Admin

  1 yıl önce

Responsive 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

Yavuz Selim Kısmetli

  1 yıl önce

Teşekkürler hocam, faydalı bir yazı olmuş.

eren

eren

  1 yıl önce

merhabalar bu değerli yazınız için çok teşekkür ederim

Hakan

Hakan

  2 ay önce

Peki reset.css meyerweb ile normalize aynı anda kullanılır mı? Ne gibi faydası olur?

Emre Ceyhan

Emre Ceyhan | Admin

  2 ay önce

Aynı anda kullanılması tamamen gereksiz.

Yorum Yap

CSS3 -webkit / -moz / -o Nedir ? CSS3 ve Tarayıcı İlişkisi

Belki daha önce karşılaşmız olabilirsiniz.Bazı CSS3 kodları birkaç defa aynı yazılıp baş...

  616   2 gün önce

CSS3 Geçiş Efektleri - Transition Nedir? Nasıl Kullanılır?

Merhaba arkadaşlar, çoğu sitelerde gördüğümüz daha yumuşak ve animasyonlu şekilde geçiş ...

  345   1 hafta önce

3. İndir.com Mobil Uygulama Yarışması ABD'ye Götürüyor

İNDİR.COM MOBİL UYGULAMA YARIŞMASI ABD’ YE GÖTÜRÜYOR Geçtiğimiz ik...

  852   11 ay önce

CSS [ text-transform:uppercase ] Karakter Sorunu Çözümü

Css'de metin (text) biçimlendirme özelliklerinden biri olan text-transform:uppercase parametresini...

  3059   1 yıl önce

Mesut Hocaoglu 1 hafta önce demiş ki;


İnternet ortamında " bu işin piriyim " diye geçinenlere nazaran kısa ve açıklayıcı anlatım...
Yoruma Git

Kutay Erten 1 hafta önce demiş ki;


Kardeşim seni tebrik ediyorum bu kadar kısa bir kodu uzun uzun anlatmışşın , renk geçişleri...
Yoruma Git

Abdullah 1 hafta önce demiş ki;


Teşekkürler:)
Yoruma Git

Ahmet Altınkaynak 3 hafta önce demiş ki;


Site içeriğini ve samimi cevaplarınızı çok takdir ettim. Bilgiler çok işime yarıyor Teşekk...
Yoruma Git