{"id":5946,"date":"2021-10-11T10:30:00","date_gmt":"2021-10-11T07:30:00","guid":{"rendered":"https:\/\/www.niobehosting.com\/blog\/?p=5946"},"modified":"2021-08-23T19:26:32","modified_gmt":"2021-08-23T16:26:32","slug":"less","status":"publish","type":"post","link":"https:\/\/www.niobehosting.com\/blog\/less\/","title":{"rendered":"LESS Nedir?"},"content":{"rendered":"\n<p>Modern web sitelerini programlamak veya tasarlamak isteyen hi\u00e7 kimse CSS&#8217;den ka\u00e7amaz. CSS, HTML gibi World Wide Web&#8217;in temel dillerinden biridir ve web sayfalar\u0131n\u0131n stilini ve d\u00fczenini kontrol etmek i\u00e7in kullan\u0131l\u0131r.<\/p>\n\n\n\n<p>Bu; d\u00fczen, renkler veya tipografi gibi de\u011fi\u015fkenlerin kaynak kodunu tamamen elden ge\u00e7irmeye gerek kalmadan, herhangi bir zamanda ayarlanmas\u0131n\u0131 sa\u011flar. Tasar\u0131mla ilgili bu bilgiler, CSS&#8217;ye dayal\u0131 stil sayfalar\u0131nda saklan\u0131r. Ancak, bir web projesi ne kadar b\u00fcy\u00fckse, stil sayfalar\u0131 o kadar karma\u015f\u0131k ve kafa kar\u0131\u015ft\u0131r\u0131c\u0131 hale gelir. Bu y\u00fczden web diliyle \u00e7al\u0131\u015fmak \u00e7ok zorla\u015f\u0131r. CSS \u00f6ni\u015flemcisi LESS burada yaz\u0131l\u0131mc\u0131lar i\u00e7in bir rahatlama sa\u011flar.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">LESS Nedir?<\/h2>\n\n\n\n<p>LESS (Leaner Style Sheets), LESS daha h\u0131zl\u0131 ve kolay CSS yazabilmenizi sa\u011flayan dinamik bir \u00f6ni\u015flemci stil sayfas\u0131 dilidir. Alexis Sellier 2009&#8217;da CSS \u00f6n i\u015flemcisini piyasaya s\u00fcrd\u00fc\u011f\u00fcnde, LESS&#8217;i CSS&#8217;ye d\u00f6n\u00fc\u015ft\u00fcrmek i\u00e7in Ruby de geli\u015ftirmi\u015ftir. Ancak \u015fimdi, Javascript\u2019e aktar\u0131lm\u0131\u015f Less.js, stil sayfas\u0131 dilinin ve derleme s\u00fcrecinin temelini olu\u015fturur.&nbsp;<\/p>\n\n\n\n<p>Derlendi\u011finde, &#8220;LESS&#8221; CSS kodlar\u0131 olu\u015fturur ve istemci taraf\u0131nda (yaln\u0131zca modern taray\u0131c\u0131lar) veya sunucu taraf\u0131nda (Node.js ve Rhino ile) \u00e7al\u0131\u015ft\u0131r\u0131labilir. &#8220;LESS&#8221;, CSS&#8217;ye variables (de\u011fi\u015fkenler), mixins (stil birle\u015ftirmeleri), operations (d\u00f6rt i\u015flem) ve i\u015flevler gibi belirli \u00f6zellikler ve functions (fonksiyonlar) ekler. Bu \u00f6zellikler, hem minimal hem de esnek olan etkili bir tasar\u0131m d\u00fczeni geli\u015ftirmenize olanak tan\u0131r. Ayr\u0131ca, &#8220;LESS&#8221; CSS \u00f6ni\u015flemci kodlar\u0131, \u00e7e\u015fitli web taray\u0131c\u0131lar\u0131yla uyumludur.<\/p>\n\n\n\n<p>Yaz\u0131l\u0131mc\u0131lar \u00e7o\u011fu zaman, belirsiz stil sorunlar\u0131yla kar\u015f\u0131la\u015ft\u0131\u011f\u0131 i\u00e7in d\u00fcz CSS sat\u0131rlar\u0131n\u0131 yazmak yorucu olabilir. Bu nedenle, daha b\u00fcy\u00fck bir proje \u00fczerinde \u00e7al\u0131\u015f\u0131rken CSS kodunuzu m\u00fcmk\u00fcn oldu\u011funca az ve temiz tutmaya \u00e7al\u0131\u015f\u0131n. Bunun i\u00e7in &#8220;LESS&#8221; CSS \u00f6ni\u015flemcisine ihtiyac\u0131n\u0131z olacak ve \u00e7ok zaman kazanacaks\u0131n\u0131z.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">LESS ve CSS Aras\u0131ndaki Farklar<\/h2>\n\n\n\n<p>Hem CSS hem de LESS, stil sayfas\u0131 dilleri olarak kabul edilir. Bu nedenle, kullan\u0131c\u0131 aray\u00fczlerinin ve belgelerin g\u00f6r\u00fcn\u00fcm\u00fcn\u00fc belirleyen resmi dillerdir. <strong>LESS ve CSS aras\u0131ndaki temel fark<\/strong>, CSS&#8217;nin statik bir dil olmas\u0131, LESS&#8217;in ise dinamik diller aras\u0131nda yer almas\u0131d\u0131r. Bu sayede de\u011fi\u015fkenler, stil birle\u015ftirmeleri ve CSS&#8217;de bulunmayan i\u00e7 i\u00e7e elemanlar (nesting items) gibi dinamik \u00f6zellikler sunar.<\/p>\n\n\n\n<p>CSS&#8217;deki talimatlar\u0131n sabit bir \u015fema izlemesi gerekirken, LESS, geli\u015ftiriciler i\u00e7in \u00f6nemli \u00f6l\u00e7\u00fcde daha esnek olanaklar sunar. \u00d6rne\u011fin, bir stil sayfas\u0131 boyunca herhangi bir \u00f6\u011fe s\u0131n\u0131f\u0131 i\u00e7in bireysel kurallar tan\u0131mlanabilir, bu \u015fekilde ayn\u0131 kodlar\u0131n s\u00fcrekli yeniden yaz\u0131lmas\u0131 gereksiz hale gelir.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">LESS Kurulum ve Ba\u015flang\u0131\u00e7 A\u015famas\u0131<\/h2>\n\n\n\n<p>LESS&#8217;in anla\u015f\u0131lmas\u0131, kurulmas\u0131 ve kullan\u0131lmas\u0131 kolayd\u0131r.&nbsp;<\/p>\n\n\n\n<p>Web sayfan\u0131za LESS y\u00fcklemek i\u00e7in:<\/p>\n\n\n\n<ul class=\"wp-block-list\"><li>Less.js JavaScript dosyas\u0131n\u0131 LESS web sitesinden indirin.<\/li><li>Dosyay\u0131 web sitenizde document root gibi bir yere kaydedin.<\/li><li>LESS stil sayfan\u0131z\u0131 yaz\u0131n (\u00f6rne\u011fin, document root\u2019taki style.less adl\u0131 bir dosyaya kaydedin).<\/li><li>Less.js ve LESS stil sayfas\u0131 dosyan\u0131z\u0131 web sayfalar\u0131n\u0131z\u0131n ba\u015f b\u00f6l\u00fcm\u00fcne ekleyin:<\/li><\/ul>\n\n\n\n<div class=\"wp-block-image\"><figure class=\"aligncenter size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"681\" height=\"194\" src=\"https:\/\/www.niobehosting.com\/blog\/wp-content\/uploads\/less-kurulum-ve-baslangic-asamasi-1.png\" alt=\"\" class=\"wp-image-5950\" srcset=\"https:\/\/www.niobehosting.com\/blog\/wp-content\/uploads\/less-kurulum-ve-baslangic-asamasi-1.png 681w, https:\/\/www.niobehosting.com\/blog\/wp-content\/uploads\/less-kurulum-ve-baslangic-asamasi-1-300x85.png 300w, https:\/\/www.niobehosting.com\/blog\/wp-content\/uploads\/less-kurulum-ve-baslangic-asamasi-1-100x28.png 100w\" sizes=\"auto, (max-width: 681px) 100vw, 681px\" \/><\/figure><\/div>\n\n\n\n<p>LESS stil sayfas\u0131 ba\u011flant\u0131s\u0131n\u0131n, less.js&#8217;nin head b\u00f6l\u00fcm\u00fcn\u00fcze eklenmesinden \u00f6nce oldu\u011fundan emin olun.<\/p>\n\n\n\n<p>\u0130\u015fte bu kadar!&nbsp;<\/p>\n\n\n\n<p>Sayfan\u0131z y\u00fcklendi\u011finde, less.js beti\u011fi otomatik olarak \u00e7al\u0131\u015f\u0131r, LESS stil sayfas\u0131 kurallar\u0131n\u0131z\u0131 normal CSS kurallar\u0131na d\u00f6n\u00fc\u015ft\u00fcr\u00fcr ve bunlar daha sonra taray\u0131c\u0131 taraf\u0131ndan i\u015flenir.<\/p>\n\n\n\n<p>Art\u0131k LESS&#8217;i nas\u0131l kuraca\u011f\u0131n\u0131z\u0131 bildi\u011finize g\u00f6re, en \u00f6nemli \u00f6zelliklerine ge\u00e7ebiliriz.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">LESS CSS \u00d6n \u0130\u015flemcisinde Bulunan En \u00d6nemli \u00d6zellikler<\/h2>\n\n\n\n<h3 class=\"wp-block-heading\">1. Variables (De\u011fi\u015fkenler)<\/h3>\n\n\n\n<p>JavaScript, Java, Python vb. di\u011fer programlama dillerinde oldu\u011fu gibi, &#8220;LESS&#8221; CSS \u00f6n i\u015flemcisinde de de\u011fi\u015fkenleri tan\u0131mlayabilir ve bu de\u011fi\u015fkenleri istedi\u011finiz yerde kullanabilirsiniz. De\u011fi\u015fkenleri bildirmek i\u00e7in \u00f6n ek olarak \u201c@\u201d eklemek zorunludur.&nbsp;<\/p>\n\n\n\n<p>\u015eimdi, bir de\u011fi\u015fkeni @brand-color olarak tan\u0131mlayal\u0131m ve arka plan rengini ayarlamak i\u00e7in onu iki HTML \u00f6\u011fesinde kullanal\u0131m.<\/p>\n\n\n\n<p>De\u011fi\u015fkenleri ortak bir konumda tan\u0131mlayabilir ve bunlar\u0131 web uygulamas\u0131 geli\u015ftirme projeniz s\u00fcresince kullanabilirsiniz. Marka rengi gibi bir de\u011fi\u015fken bildirmek, onu kolayca hat\u0131rlaman\u0131za ve marka rengini gerekti\u011fi yerde \u00f6\u011felere uygulaman\u0131za yard\u0131mc\u0131 olacakt\u0131r.<\/p>\n\n\n\n<p>\u201cLess\u201d Code<\/p>\n\n\n\n<p>@brand-color:&nbsp; #EF592B;<\/p>\n\n\n\n<p>@font-color: #000000;&nbsp;<\/p>\n\n\n\n<p>div {<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;background-color: @brand-color;<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<p>h3 {<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;color: @font-color;<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<p>Compiled Equivalent CSS Code<\/p>\n\n\n\n<p>div {<\/p>\n\n\n\n<p>&nbsp;&nbsp;background-color: #EF592B;<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<p>h3 {<\/p>\n\n\n\n<p>&nbsp;&nbsp;color: #000000;<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">2. Mixins (Stil Birle\u015ftirmeleri)<\/h3>\n\n\n\n<p>Stil Birle\u015ftirmeleri, ekstra avantaj\u0131 olan de\u011fi\u015fkenlere benzer. <strong>Mixins <\/strong>ile tam bir s\u0131n\u0131f ad\u0131 tan\u0131mlayabilir ve yaz\u0131 tipi rengi, yaz\u0131 tipi boyutu, dolgu, kenar bo\u015flu\u011fu vb. \u00e7e\u015fitli \u00f6zellikleri ayarlayabilirsiniz. Bu s\u0131n\u0131f adlar\u0131n\u0131 ayn\u0131 kodu tekrar etmeden gerekli t\u00fcm sayfalara \u00e7a\u011f\u0131rabilirsiniz.<\/p>\n\n\n\n<p>Ba\u015fka bir deyi\u015fle, Mixins ile bir kural k\u00fcmesinden ba\u015fka bir kural k\u00fcmesine bir dizi \u00f6zellik ekleyebilirsiniz. Ayr\u0131ca bu \u00f6zellikleri di\u011fer kural k\u00fcmelerinde de s\u0131n\u0131f ad\u0131n\u0131 istedi\u011finiz yere ekleyerek kullanabilirsiniz.<\/p>\n\n\n\n<p>&#8220;.dimensions&#8221; s\u0131n\u0131f\u0131n\u0131n \u00f6zellikleri art\u0131k hem &#8220;.outer-wrapper&#8221; hem de &#8220;.inner-wrapper&#8221; i\u00e7inde g\u00f6r\u00fcnecektir. (&#8220;#ids&#8221; ifadesini mixin olarak da kullanabilece\u011finizi unutmay\u0131n.)<\/p>\n\n\n\n<p>\u201cLess\u201d Code<\/p>\n\n\n\n<p>#divAbout {<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;color: #EF592B;<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;background-color: #000000;<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<p>.dimensions(@height: 50px; @width: 30px) {<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;height: @height;<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;width: @width;<\/p>\n\n\n\n<p>&nbsp;&nbsp;#divAbout;<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<p>.outer-wrapper {<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;.dimensions(25px; 65px);<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<p>.inner-wrapper {<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;.dimensions();<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<p>Compiled Equivalent CSS Code<\/p>\n\n\n\n<p>#divAbout {<\/p>\n\n\n\n<p>&nbsp;&nbsp;color: #EF592B;<\/p>\n\n\n\n<p>&nbsp;&nbsp;background-color: #000000;<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<p>.outer-wrapper {<\/p>\n\n\n\n<p>&nbsp;&nbsp;height: 25px;<\/p>\n\n\n\n<p>&nbsp;&nbsp;width: 65px;<\/p>\n\n\n\n<p>&nbsp;&nbsp;color: #EF592B;<\/p>\n\n\n\n<p>&nbsp;&nbsp;background-color: #000000;<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<p>.inner-wrapper {<\/p>\n\n\n\n<p>&nbsp;&nbsp;height: 50px;<\/p>\n\n\n\n<p>&nbsp;&nbsp;width: 30px;<\/p>\n\n\n\n<p>&nbsp;&nbsp;color: #EF592B;<\/p>\n\n\n\n<p>&nbsp;&nbsp;background-color: #000000;<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">3. Operations (D\u00f6rt \u0130\u015flem)<\/h3>\n\n\n\n<p>&#8220;LESS&#8221; CSS \u00f6n i\u015flemcisi ile \u00e7arpma, b\u00f6lme, toplama ve \u00e7\u0131karma kullanarak istenen de\u011ferlere ula\u015fmak i\u00e7in kodlar i\u00e7inde belirli aritmetik i\u015flemleri yapman\u0131za izin verilir. Bu aritmetik i\u015flemler sadece say\u0131larla s\u0131n\u0131rl\u0131 de\u011fildir, renkler ve de\u011fi\u015fkenler \u00fczerinde de ge\u00e7erlidir.<\/p>\n\n\n\n<p>Statik rengi, y\u00fcksekli\u011fi ve geni\u015fli\u011fi tan\u0131mlayabilir ve ard\u0131ndan \u201c.inner-wrapper\u201d \u00f6\u011fesi i\u00e7in y\u00fckseklik ve geni\u015flik de\u011ferlerini orijinal de\u011ferlerinin yar\u0131s\u0131na atayabilirsiniz. Ard\u0131ndan, bir ekleme i\u015flemi kullanarak farkl\u0131 bir renk ayarlayabilirsiniz.<\/p>\n\n\n\n<p>\u201cLESS\u201d Code<\/p>\n\n\n\n<p>@prime-color: #00ff00;<\/p>\n\n\n\n<p>@width: 40px;<\/p>\n\n\n\n<p>@height:40px;&nbsp;<\/p>\n\n\n\n<p>.inner-wrapper {<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;width: @width \/ 2;<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;height: @height \/ 2;<\/p>\n\n\n\n<p>&nbsp;&nbsp;&nbsp;color: @prime-color + #0000ff;<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<p>Compiled Equivalent CSS Code<\/p>\n\n\n\n<p>.inner-wrapper {<\/p>\n\n\n\n<p>&nbsp;&nbsp;width: 20px;<\/p>\n\n\n\n<p>&nbsp;&nbsp;height: 20px;<\/p>\n\n\n\n<p>&nbsp;&nbsp;color: #00ffff;<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">4. Fonksiyonlar<\/h3>\n\n\n\n<p>&#8220;LESS&#8221; CSS \u00f6n i\u015flemcisi, renkleri de\u011fi\u015ftirmenize, matematik yapman\u0131za ve dizeleri de\u011fi\u015ftirmenize olanak tan\u0131yan bir dizi i\u015flev sunar. Bunlar\u0131 stil sayfan\u0131zda kullanmak olduk\u00e7a basittir. A\u015fa\u011f\u0131da, ana renk ve dolgunun tan\u0131mland\u0131\u011f\u0131 bir \u00e7izim bulunmaktad\u0131r. Fonksiyonlar yard\u0131m\u0131yla rengi a\u00e7abilir ve dolgu de\u011ferini y\u00fckseltebilirsiniz.<\/p>\n\n\n\n<p>\u201cLess\u201d Code<\/p>\n\n\n\n<p>@prime-color: #0000ff;<\/p>\n\n\n\n<p>@padding: 4px;<\/p>\n\n\n\n<p>div {<\/p>\n\n\n\n<p>color: lighten(@prime-color, 10%);<\/p>\n\n\n\n<p>padding-right: round(@padding);<\/p>\n\n\n\n<p>padding-left: round(@padding);<\/p>\n\n\n\n<p>padding-top: ceil(@padding) * 1.25;<\/p>\n\n\n\n<p>padding-bottom: ceil(@padding) * 1.25;<\/p>\n\n\n\n<p>background-color: rgb(239, 89, 43);<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<p>Compiled Equivalent CSS Code<\/p>\n\n\n\n<p>div {<\/p>\n\n\n\n<p>&nbsp;&nbsp;color: #3333ff;<\/p>\n\n\n\n<p>&nbsp;&nbsp;padding-right: 4px;<\/p>\n\n\n\n<p>&nbsp;&nbsp;padding-left: 4px;<\/p>\n\n\n\n<p>&nbsp;&nbsp;padding-top: 5px;<\/p>\n\n\n\n<p>&nbsp;&nbsp;padding-bottom: 5px;<\/p>\n\n\n\n<p>&nbsp;&nbsp;background-color: #ef592b;<\/p>\n\n\n\n<p>}<\/p>\n\n\n\n<p>Bu y\u00f6ntemlerden yararlanarak, web projelerinizde kullanabilece\u011finiz istenen renk \u00e7\u0131kt\u0131s\u0131n\u0131 elde etmek i\u00e7in bir ana rengi di\u011fer renklerle kar\u0131\u015ft\u0131rabilirsiniz. JavaScript&#8217;e olduk\u00e7a benzer oldu\u011fundan, stil sayfas\u0131nda mant\u0131ksal i\u015flevselli\u011fin uygulanmas\u0131n\u0131 basitle\u015ftirmeye yard\u0131mc\u0131 olacakt\u0131r.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Modern web sitelerini programlamak veya tasarlamak isteyen hi\u00e7 kimse CSS&#8217;den ka\u00e7amaz. CSS, HTML gibi World Wide Web&#8217;in temel dillerinden biridir ve web sayfalar\u0131n\u0131n stilini ve&#8230;<\/p>\n","protected":false},"author":11,"featured_media":5954,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[48],"tags":[],"class_list":["post-5946","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-programlama"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.8 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>LESS Nedir? - Niobe Hosting<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/www.niobehosting.com\/blog\/less\/\" \/>\n<meta property=\"og:locale\" content=\"tr_TR\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"LESS Nedir? - Niobe Hosting\" \/>\n<meta property=\"og:description\" content=\"Modern web sitelerini programlamak veya tasarlamak isteyen hi\u00e7 kimse CSS&#8217;den ka\u00e7amaz. CSS, HTML gibi World Wide Web&#8217;in temel dillerinden biridir ve web sayfalar\u0131n\u0131n stilini ve...\" \/>\n<meta property=\"og:url\" content=\"https:\/\/www.niobehosting.com\/blog\/less\/\" \/>\n<meta property=\"og:site_name\" content=\"Niobe Hosting\" \/>\n<meta property=\"article:published_time\" content=\"2021-10-11T07:30:00+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/www.niobehosting.com\/blog\/wp-content\/uploads\/less-nedir.png\" \/>\n\t<meta property=\"og:image:width\" content=\"720\" \/>\n\t<meta property=\"og:image:height\" content=\"400\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Sibel Ho\u015f\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Yazan:\" \/>\n\t<meta name=\"twitter:data1\" content=\"Sibel Ho\u015f\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tahmini okuma s\u00fcresi\" \/>\n\t<meta name=\"twitter:data2\" content=\"5 dakika\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/less\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/less\\\/\"},\"author\":{\"name\":\"Sibel Ho\u015f\",\"@id\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/#\\\/schema\\\/person\\\/9edcd33ccd851c17242fa59c562c1f26\"},\"headline\":\"LESS Nedir?\",\"datePublished\":\"2021-10-11T07:30:00+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/less\\\/\"},\"wordCount\":1308,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/less\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/wp-content\\\/uploads\\\/less-nedir.png\",\"articleSection\":[\"Programlama\"],\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/less\\\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/less\\\/\",\"url\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/less\\\/\",\"name\":\"LESS Nedir? - Niobe Hosting\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/less\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/less\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/wp-content\\\/uploads\\\/less-nedir.png\",\"datePublished\":\"2021-10-11T07:30:00+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/less\\\/#breadcrumb\"},\"inLanguage\":\"tr\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/less\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"tr\",\"@id\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/less\\\/#primaryimage\",\"url\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/wp-content\\\/uploads\\\/less-nedir.png\",\"contentUrl\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/wp-content\\\/uploads\\\/less-nedir.png\",\"width\":720,\"height\":400},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/less\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Anasayfa\",\"item\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"LESS Nedir?\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/\",\"name\":\"Niobe Hosting\",\"description\":\"Niobe Hosting\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"tr\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/#organization\",\"name\":\"Niobe Hosting\",\"url\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"tr\",\"@id\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/wp-content\\\/uploads\\\/blog-logo.png\",\"contentUrl\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/wp-content\\\/uploads\\\/blog-logo.png\",\"width\":332,\"height\":49,\"caption\":\"Niobe Hosting\"},\"image\":{\"@id\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/#\\\/schema\\\/logo\\\/image\\\/\"}},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/#\\\/schema\\\/person\\\/9edcd33ccd851c17242fa59c562c1f26\",\"name\":\"Sibel Ho\u015f\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"tr\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/f925f03d20ff0803ddb37c96d39d3793c085014ce56421050f24823c23db1c2a?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/f925f03d20ff0803ddb37c96d39d3793c085014ce56421050f24823c23db1c2a?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/f925f03d20ff0803ddb37c96d39d3793c085014ce56421050f24823c23db1c2a?s=96&d=mm&r=g\",\"caption\":\"Sibel Ho\u015f\"},\"sameAs\":[\"https:\\\/\\\/www.instagram.com\\\/bismoothie\\\/\",\"https:\\\/\\\/www.linkedin.com\\\/in\\\/sibelhos\\\/\"],\"url\":\"https:\\\/\\\/www.niobehosting.com\\\/blog\\\/author\\\/sibel\\\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"LESS Nedir? - Niobe Hosting","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/www.niobehosting.com\/blog\/less\/","og_locale":"tr_TR","og_type":"article","og_title":"LESS Nedir? - Niobe Hosting","og_description":"Modern web sitelerini programlamak veya tasarlamak isteyen hi\u00e7 kimse CSS&#8217;den ka\u00e7amaz. CSS, HTML gibi World Wide Web&#8217;in temel dillerinden biridir ve web sayfalar\u0131n\u0131n stilini ve...","og_url":"https:\/\/www.niobehosting.com\/blog\/less\/","og_site_name":"Niobe Hosting","article_published_time":"2021-10-11T07:30:00+00:00","og_image":[{"width":720,"height":400,"url":"https:\/\/www.niobehosting.com\/blog\/wp-content\/uploads\/less-nedir.png","type":"image\/png"}],"author":"Sibel Ho\u015f","twitter_card":"summary_large_image","twitter_misc":{"Yazan:":"Sibel Ho\u015f","Tahmini okuma s\u00fcresi":"5 dakika"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.niobehosting.com\/blog\/less\/#article","isPartOf":{"@id":"https:\/\/www.niobehosting.com\/blog\/less\/"},"author":{"name":"Sibel Ho\u015f","@id":"https:\/\/www.niobehosting.com\/blog\/#\/schema\/person\/9edcd33ccd851c17242fa59c562c1f26"},"headline":"LESS Nedir?","datePublished":"2021-10-11T07:30:00+00:00","mainEntityOfPage":{"@id":"https:\/\/www.niobehosting.com\/blog\/less\/"},"wordCount":1308,"commentCount":0,"publisher":{"@id":"https:\/\/www.niobehosting.com\/blog\/#organization"},"image":{"@id":"https:\/\/www.niobehosting.com\/blog\/less\/#primaryimage"},"thumbnailUrl":"https:\/\/www.niobehosting.com\/blog\/wp-content\/uploads\/less-nedir.png","articleSection":["Programlama"],"inLanguage":"tr","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/www.niobehosting.com\/blog\/less\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/www.niobehosting.com\/blog\/less\/","url":"https:\/\/www.niobehosting.com\/blog\/less\/","name":"LESS Nedir? - Niobe Hosting","isPartOf":{"@id":"https:\/\/www.niobehosting.com\/blog\/#website"},"primaryImageOfPage":{"@id":"https:\/\/www.niobehosting.com\/blog\/less\/#primaryimage"},"image":{"@id":"https:\/\/www.niobehosting.com\/blog\/less\/#primaryimage"},"thumbnailUrl":"https:\/\/www.niobehosting.com\/blog\/wp-content\/uploads\/less-nedir.png","datePublished":"2021-10-11T07:30:00+00:00","breadcrumb":{"@id":"https:\/\/www.niobehosting.com\/blog\/less\/#breadcrumb"},"inLanguage":"tr","potentialAction":[{"@type":"ReadAction","target":["https:\/\/www.niobehosting.com\/blog\/less\/"]}]},{"@type":"ImageObject","inLanguage":"tr","@id":"https:\/\/www.niobehosting.com\/blog\/less\/#primaryimage","url":"https:\/\/www.niobehosting.com\/blog\/wp-content\/uploads\/less-nedir.png","contentUrl":"https:\/\/www.niobehosting.com\/blog\/wp-content\/uploads\/less-nedir.png","width":720,"height":400},{"@type":"BreadcrumbList","@id":"https:\/\/www.niobehosting.com\/blog\/less\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Anasayfa","item":"https:\/\/www.niobehosting.com\/blog\/"},{"@type":"ListItem","position":2,"name":"LESS Nedir?"}]},{"@type":"WebSite","@id":"https:\/\/www.niobehosting.com\/blog\/#website","url":"https:\/\/www.niobehosting.com\/blog\/","name":"Niobe Hosting","description":"Niobe Hosting","publisher":{"@id":"https:\/\/www.niobehosting.com\/blog\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/www.niobehosting.com\/blog\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"tr"},{"@type":"Organization","@id":"https:\/\/www.niobehosting.com\/blog\/#organization","name":"Niobe Hosting","url":"https:\/\/www.niobehosting.com\/blog\/","logo":{"@type":"ImageObject","inLanguage":"tr","@id":"https:\/\/www.niobehosting.com\/blog\/#\/schema\/logo\/image\/","url":"https:\/\/www.niobehosting.com\/blog\/wp-content\/uploads\/blog-logo.png","contentUrl":"https:\/\/www.niobehosting.com\/blog\/wp-content\/uploads\/blog-logo.png","width":332,"height":49,"caption":"Niobe Hosting"},"image":{"@id":"https:\/\/www.niobehosting.com\/blog\/#\/schema\/logo\/image\/"}},{"@type":"Person","@id":"https:\/\/www.niobehosting.com\/blog\/#\/schema\/person\/9edcd33ccd851c17242fa59c562c1f26","name":"Sibel Ho\u015f","image":{"@type":"ImageObject","inLanguage":"tr","@id":"https:\/\/secure.gravatar.com\/avatar\/f925f03d20ff0803ddb37c96d39d3793c085014ce56421050f24823c23db1c2a?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/f925f03d20ff0803ddb37c96d39d3793c085014ce56421050f24823c23db1c2a?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/f925f03d20ff0803ddb37c96d39d3793c085014ce56421050f24823c23db1c2a?s=96&d=mm&r=g","caption":"Sibel Ho\u015f"},"sameAs":["https:\/\/www.instagram.com\/bismoothie\/","https:\/\/www.linkedin.com\/in\/sibelhos\/"],"url":"https:\/\/www.niobehosting.com\/blog\/author\/sibel\/"}]}},"_links":{"self":[{"href":"https:\/\/www.niobehosting.com\/blog\/wp-json\/wp\/v2\/posts\/5946","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.niobehosting.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.niobehosting.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.niobehosting.com\/blog\/wp-json\/wp\/v2\/users\/11"}],"replies":[{"embeddable":true,"href":"https:\/\/www.niobehosting.com\/blog\/wp-json\/wp\/v2\/comments?post=5946"}],"version-history":[{"count":0,"href":"https:\/\/www.niobehosting.com\/blog\/wp-json\/wp\/v2\/posts\/5946\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.niobehosting.com\/blog\/wp-json\/wp\/v2\/media\/5954"}],"wp:attachment":[{"href":"https:\/\/www.niobehosting.com\/blog\/wp-json\/wp\/v2\/media?parent=5946"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.niobehosting.com\/blog\/wp-json\/wp\/v2\/categories?post=5946"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.niobehosting.com\/blog\/wp-json\/wp\/v2\/tags?post=5946"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}