Anasayfa / Web Tasarım / LESS ile daha az CSS
Sponsorlu Bağlantılar

LESS ile daha az CSS

less-css
LESS tarafından geliştirilmiş olan 46kb boyutlu less.js dosyası. Stil dosyalarınızı bayağı hafifletici bir etkiye sahip. Örneğin aynı renk kodu temanızın stil dosyasında 20 kere geçiyorsa bu sayıyı 1’e indirmek mümkün. Böylece sadece belirlediğiniz değişkenin renk değeriyle oynanarak 20 yeri birden düzenlemiş olacak.

LESS ile derlenmeden CSS kodlarımız aşağıdaki gibi 10px ve 5px değerinde kenarları yuvarlattık.

#header {
border-radius:5px;
-webkit-border-radius:5px;
-moz-border-radius:5px;
}
#footer {
border-radius:10px;
-webkit-border-radius:10px;
-moz-border-radius:10px;
}

Bakalım nasıl LESS ile işlem yapılıyor?

.radius (@radius: 5px) {
border-radius: @radius;
-webkit-border-radius: @radius;
-moz-border-radius: @radius;
}

Sponsorlu Bağlantılar

#header {
.radius;
}
#footer {
.radius(10px);
}

Kaynaklar

http://lesscss.org/
http://lessframework.com/
http://webdesign.tutsplus.com/tutorials/htmlcss-tutorials/get-into-less-…
http://twitter.github.com/bootstrap/less.html

Hakkında Serkan Çataltaş

1987 Yılında Malatya'da doğdu. Netaş'ta çalışmalarına devam etmektedir.
Sponsorlu Bağlantılar

Bir Yorum Yazın