Neden Less Kullanıyorum?

Neden Less

Neden Less kullanıyorum sorusunun cevabı, sanırım herkes için aynıdır.

Projeye Less ile başlamak, çalıştığım projeyi hazırlama ve düzenleme de ciddi zaman tasarrufu sağlar.

Bu açıklama sanırım birçok şeyi açıklıyor. Projenizin üretim süresi ne kadar kısa olursa fiyatınız ona göre olur. Müşterilerinizden gelen geri bildirimleri ne kadar hızlı düzenlerseniz. O kadar rahat çalışır, ve projeye olan motivasyonunuz düşmez.

Aslında Neden Less sorusu yerine, Neden Sass? veya
Neden Stylus? sorusuda sorulabilirdi. Hepsi aynı kapıya çıkıyor, çünkü hepsi aynı işi yapar.

Css Preprocessor

Css’yi önceden işlemek anlamına gelir.
Css Preprocessor terimi Less, Sass veya Stylus gibi önişleyicilerin genel adıdır. Buradaki linkte en popüler olanları listelenmiştir. İçlerinden birini seçip kullanmaya başlamalısınız. (Benim tercihim Less’den yana oldu.)

Css3 kullanıma açıldığında çok güzel özelliklerle geldi.

  • Gradients
  • Box Shadow
  • Box Sizing

Bunlardan sadece birkaçı, fakat bu yenilikler tarayıcılar tarafından farklı farklı yorumlandı her üretici kendi parametresini belirledi. (İnternet Explorer listeye bile dahil etmiyorum.) Box Shadow özelliğini ele alalım.

Çalışmanız için content sınıfına ait bir nesneye gölge vermek istediğinizde lider tarayıcı markaları için ayrı ayrı kod yazmak zorunda bırakıldık. İşte bu sebeple Css dosyamızı önden işleyecek bir arabirime ihtiyaç duyduk. Tüm bu kodları tekrar tekrar yazmamak için Css’yi önden işleyerek çıktı veren araçlar doğdu.

Şimdiye kadar Less ve benzeri işleyicilerin hangi ihtiyaçtan doğduğunu ve ne sebeple kullanılması gerektiğini açıklamaya çalıştım.

Şimdi gelelim tarayıcaların istediği bu kod kalabalığından kurtulmak için Less ile kullanabileceğiniz birbirinden değerli 10 Mixin‘e

Less Mixin Kullanımı

Less içinde mixin kullanımı çok basit bir standarta tabiidir. Mixin kalıbını doğru anlarsanız çok hızlı sonuçlar elde edersiniz.

2 çeşit Mixin kullanımı vardır.

1.Standart Mixin

2.Parametric Mixin (Değer alabilen)

 

Less en çok kullanılan Mixin kalıpları

1.Border Radius

border radius

2.Border Radius Özel

 

3.Box Shadow

shadows

4.Transition

less-snippets-4

5.Transform

transform

Gradient

gradient

6.Linear Gradient

7.Quick Gradient

8.Webkit Reflection

reflect

Renk Hesaplamaları

9.Çok Renkli Şema

renk

10.Monochrome Renk Şeması

mono

Bir cevap yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir