CSS Reset nedir?

CSS Reset — tüm HTML öğeleri için varsayılan tutarlı temel stiller belirlemek amacıyla tasarlanmış bir CSS kuralları kümesidir ve tarayıcıların standart stillerindeki farklılıkları aşar. Bu, web sayfalarının daha öngörülebilir ve tarayıcılar arası uyumlu görüntülenmesini sağlar.

CSS Reset'in ana hedefleri:

• Varsayılan marjlar (margin, padding) ve kenarlıkları kaldırmak veya sıfırlamak.
• Başlıklar, paragraflar vb. için varsayılan yazı tipi boyutlarını ve satır aralıklarını sıfırlamak.
• Listelerin (ul, ol) tutarlı biçimde görünmesini sağlamak.
• Tablo, form, resim ve diğer öğeler için stilleri sıfırlamak.

Temel bir CSS Reset örneği:

/*
   CSS Reset: Tarayıcıların varsayılan stillerini sıfırlar
   ve öğelerin tutarlı temel görünümünü sağlar.
*/

*, *::before, *::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box; /* Padding ve border'ı toplam genişlik/yükseklik içine dahil eder */
}

body {
  line-height: 1.5;
  -webkit-font-smoothing: antialiased; /* Yazı tipi yumuşatma */
}

img, picture, video, canvas, svg {
  display: block; /* Satır içi resimlerin altındaki varsayılan boşluğu kaldırır */
  max-width: 100%; /* Resimlerin konteyner dışına çıkmasını engeller */
}

input, button, textarea, select {
  font: inherit; /* Yazı tipini ebeveyninden miras alır */
}

p, h1, h2, h3, h4, h5, h6 {
  overflow-wrap: break-word; /* Uzun kelimelerin taşmasını önler */
}

Farklı CSS Reset varyantları mevcuttur, örneğin Eric Meyer'in Reset CSS'si veya Normalize.css. Normalize.css, tam bir sıfırlama yerine, kullanışlı varsayılan stilleri korur ve sadece uyumluluk sorunlarına neden olanları düzeltir. Bunlar arasından seçim, proje ve geliştiricinin tercihlerine bağlıdır.