CSS Nedir?

CSS nedir?

CSS, Cascading Style Sheets kelimelerinin kısaltmasıdır. Türkçede basamaklı stil şablonları olarak çevrilir. HTML sayfanın iskeletini kurarken CSS ona görünüm kazandırır: renkler, yazı tipleri, boşluklar, kenarlıklar ve öğelerin sayfadaki yerleşimi CSS ile belirlenir.

Dil, 1990'ların ortasında Håkon Wium Lie'nin önerisiyle ortaya çıktı ve W3C tarafından standartlaştırıldı. İçerik ile görünümün ayrılması sayesinde tek bir CSS dosyasını değiştirerek yüzlerce sayfanın görünümünü aynı anda güncelleyebilirsiniz.

Nasıl çalışır?

CSS kuralları iki parçadan oluşur: hangi öğeye uygulanacağını gösteren seçici ve uygulanacak özellikler.

h1 {
  color: #8B4513;
  font-size: 32px;
}
.buton {
  background: green;
  padding: 12px 20px;
}

İlk kural tüm h1 başlıklarını kahverengi ve 32 piksel yapar. İkinci kural buton sınıfını taşıyan öğelere yeşil arka plan ve iç boşluk verir. "Basamaklı" ifadesi, aynı öğeye birden fazla kural uyduğunda hangisinin geçerli olacağını belirleyen öncelik sistemini anlatır.

Yerleşim araçları

Modern CSS'te sayfa düzeni için iki güçlü araç bulunur. Flexbox öğeleri tek bir satır ya da sütun boyunca hizalamak için idealdir; bir menü çubuğu buna iyi bir örnektir. CSS Grid ise satır ve sütunlardan oluşan iki boyutlu düzenler kurar; ürün kartlarının sıralandığı bir vitrin sayfası gibi.

Media query'ler sayesinde aynı sayfa telefon ve bilgisayarda farklı düzenle gösterilebilir. Tailwind CSS ve Bootstrap gibi çerçeveler de hazır sınıflarla geliştirmeyi hızlandırır. Öğrenmeye başlamak için basit bir HTML sayfasına renk, yazı tipi ve kenar boşluğu ekleyerek değişimi tarayıcıda izlemek iyi bir ilk adımdır.