BLOG

Değişken tanımlamakta ki amaç aynı kodun birden fazla yerde tekrar etmesi sonucu ileride ki değişikliklerde işleri kolaylaştırmaktır. Örneğin "color: pink;" kodunu sayfamızın birkaç yerinde kullanıldığını varsayarsak tek bir yerden değişimi tüm sayfaları etkileyecektir. Bu işlem değişken tanımlamadan yapıldığında ise ilgili kodun tek tek bulunup değiştirilmesi gerekir. Global scope'ta $ (dolar) işareti ile başlayıp değişken tanımlayabilir ve kullanmaya başlayabiliriz.

Örnek 1 (font tanımlama)

$default-font: Helvetica, sans-serif;
$default-font-size: 16px;
body{
  font: $default-font-size $default-font;
}

Örnek 2 (renk tanımlama)

$baseColor: #C5C8D4;
body{
  color: $baseColor;
}

DİKKAT: Değişken tanımlarken sayılar ile işlem yapılıyorsa birimleri aynı olmak zorundadır.

Örnek

$size: 5 + 8; //Çıktı = 13

$size: 5px + 8; //Çıktı = 13px

$size: 5px + 8em; //Çıktı = HATA

$size: 5em + 8em; //Çıktı = 13em

Bir sonraki derslerde görüşmek üzere.

---

---