7. Gün: CSS’e Giriş – Web Geliştirme Yolculuğumuz
Merhaba arkadaşlar! Web geliştirme maceramızın 7. gününe hoş geldiniz. Bugün, web sayfalarımızın görünümünü ve düzenini kontrol etmemizi sağlayan güçlü bir araç olan CSS’e (Cascading Style Sheets) dalacağız. HTML ile sayfalarımızın iskeletini oluştururken, CSS ile bu iskeleti ete büründürüyoruz; yani sayfalarımıza renk, şekil ve stil katıyoruz.
Öncelikle, CSS’in ne işe yaradığını daha net anlamak için basit bir HTML örneği ele alalım. Aşağıdaki HTML kod bloğunda basit bir paragraf bulunmaktadır:
<p>Bu bir paragraf.</p>
Bu paragraf varsayılan tarayıcı stillerine göre görüntülenecektir. Ancak, CSS kullanarak bu görünümü istediğimiz gibi değiştirebiliriz. Örneğin, paragrafın rengini mavi, yazı tipini Times New Roman ve yazı boyutunu 16 piksele ayarlayabiliriz. Bunun için aşağıdaki gibi bir CSS kodu yazabiliriz:
p {
color: blue;
font-family: Times New Roman;
font-size: 16px;
}
Bu CSS kodunu HTML dosyamıza bağlayarak, paragrafın görünümünü istediğimiz gibi özelleştirebiliriz. Peki bunu nasıl yapacağız? Birkaç farklı yöntem mevcuttur. En yaygın yöntemlerden biri,