कम (स्टाइल शीट भाषा): Difference between revisions

From Vigyanwiki
No edit summary
No edit summary
Line 18: Line 18:
}}
}}


कम (लीनर स्टाइल शीट; कभी-कभी कम के रूप में शैलीबद्ध) गतिशील [[ preprocessor |preprocessor]] [[स्टाइल शीट भाषा]] है जिसे [[ व्यापक शैली पत्रक |व्यापक शैली पत्रक]] (सीएसएस) में संकलित किया जा सकता है और क्लाइंट साइड या सर्वर साइड पर चलाया जा सकता है।<ref name="main">{{Cite web|url=http://lesscss.org/|title=Getting started {{!}} Less.js|author=The Core Less Team|access-date=2021-03-19|website=Less.js}}</ref>
लेस (लीनर स्टाइल शीट; कभी-कभी लेस के रूप में शैलीबद्ध) गतिशील [[ preprocessor |प्रीप्रोसेसर]] [[स्टाइल शीट भाषा]] है जिसे [[ व्यापक शैली पत्रक |कैस्केडिंग स्टाइल शीट्स]] (सीएसएस) में संकलित किया जा सकता है और क्लाइंट साइड या सर्वर साइड पर चलाया जा सकता है।<ref name="main">{{Cite web|url=http://lesscss.org/|title=Getting started {{!}} Less.js|author=The Core Less Team|access-date=2021-03-19|website=Less.js}}</ref> एलेक्सिस सेलियर द्वारा डिज़ाइन किया गया, लेस सैस (स्टाइलशीट भाषा) से प्रभावित है और इसने सैस के नए एससीएसएस सिंटैक्स को प्रभावित किया है, जिसने इसके सीएसएस-जैसे ब्लॉक फ़ॉर्मेटिंग सिंटैक्स को अनुकूलित किया है।<ref name="compare">{{Cite web|url=http://nex-3.com/posts/83-sass-and-less|url-status=dead|archive-url=https://web.archive.org/web/20090621074106/http://nex-3.com/posts/83-sass-and-less|title=Sass and Less : Nex3|last=Weizenbaum|first=Nathan|archive-date=2009-06-21|date=2009-06-17|access-date=2021-03-19}}</ref> लेस ओपन सोर्स प्रोजेक्ट है। इसका पहला संस्करण [[रूबी (प्रोग्रामिंग भाषा)]] में लिखा गया था; चूँकि, बाद के संस्करणों में, रूबी का उपयोग बहिष्कृत कर दिया गया है और [[जावास्क्रिप्ट]] द्वारा प्रतिस्थापित किया गया है। लेस का इंडेंट सिंटैक्स मेटलंग्वेज या नेस्टेड है, क्योंकि वैध सीएसएस प्रोग्रामिंग भाषाओं के समान शब्दार्थ के साथ वैध लेस कोड है। लेस निम्नलिखित तंत्र प्रदान करता है: [[चर (प्रोग्रामिंग)]], नेस्टिंग (कंप्यूटिंग) प्रोग्रामिंग में, मिश्रण, [[ऑपरेटर (प्रोग्रामिंग)]] और फ़ंक्शन (कंप्यूटर विज्ञान); लेस और अन्य सीएसएस प्रीकंपाइलर के बीच मुख्य अंतर यह है कि लेस ब्राउज़र द्वारा लेस.जेएस के माध्यम से रीयल-टाइम संकलन की अनुमति देता है।<ref name="main" /><ref name="no-sass-js">{{cite web|url=https://stackoverflow.com/questions/4436643/is-there-a-sass-js-something-like-less-js|title=css - Is there a SASS.js? Something like LESS.js?|date=2010-12-14|access-date=2021-03-19|last=Meng|first=Jiew|editor-last=Mortensen|editor-first=Peter|work=Stack Overflow}}</ref>
एलेक्सिस सेलियर द्वारा डिज़ाइन किया गया, लेस Sass (स्टाइलशीट भाषा) से प्रभावित है और इसने Sass के नए SCSS सिंटैक्स को प्रभावित किया है, जिसने इसके CSS-जैसे ब्लॉक फ़ॉर्मेटिंग सिंटैक्स को अनुकूलित किया है।<ref name="compare">{{Cite web|url=http://nex-3.com/posts/83-sass-and-less|url-status=dead|archive-url=https://web.archive.org/web/20090621074106/http://nex-3.com/posts/83-sass-and-less|title=Sass and Less : Nex3|last=Weizenbaum|first=Nathan|archive-date=2009-06-21|date=2009-06-17|access-date=2021-03-19}}</ref> लेस [[ खुला स्रोत सॉफ्टवेयर |खुला स्रोत सॉफ्टवेयर]] प्रोजेक्ट है। इसका पहला संस्करण [[रूबी (प्रोग्रामिंग भाषा)]] में लिखा गया था; हालाँकि, बाद के संस्करणों में, रूबी का उपयोग बहिष्कृत कर दिया गया है और [[जावास्क्रिप्ट]] द्वारा प्रतिस्थापित किया गया है। लेस का इंडेंट सिंटैक्स मेटलंग्वेज # नेस्टेड है, क्योंकि वैध सीएसएस प्रोग्रामिंग भाषाओं के समान शब्दार्थ के साथ वैध लेस कोड है। लेस निम्नलिखित तंत्र प्रदान करता है: [[चर (प्रोग्रामिंग)]], नेस्टिंग (कंप्यूटिंग)#प्रोग्रामिंग में, मिश्रण, [[ऑपरेटर (प्रोग्रामिंग)]] और फ़ंक्शन (कंप्यूटर विज्ञान); लेस और अन्य सीएसएस प्रीकंपाइलर के बीच मुख्य अंतर यह है कि लेस ब्राउज़र द्वारा लेस.जेएस के माध्यम से रीयल-टाइम संकलन की अनुमति देता है।<ref name="main" /><ref name="no-sass-js">{{cite web|url=https://stackoverflow.com/questions/4436643/is-there-a-sass-js-something-like-less-js|title=css - Is there a SASS.js? Something like LESS.js?|date=2010-12-14|access-date=2021-03-19|last=Meng|first=Jiew|editor-last=Mortensen|editor-first=Peter|work=Stack Overflow}}</ref>
 
 
== सुविधाएँ ==
== सुविधाएँ ==


=== चर ===
=== चर ===
कम चर को परिभाषित करने की अनुमति देता है। लेस में वेरिएबल्स को चिह्न (@) के साथ परिभाषित किया गया है। वेरिएबल [[असाइनमेंट (कंप्यूटर प्रोग्रामिंग)]] कोलन (विराम चिह्न) (:) के साथ किया जाता है।
लेस चर को परिभाषित करने की अनुमति देता है। लेस में वेरिएबल्स को चिह्न (@) के साथ परिभाषित किया गया है। वेरिएबल [[असाइनमेंट (कंप्यूटर प्रोग्रामिंग)]] कोलन (विराम चिह्न) (:) के साथ किया जाता है।


अनुवाद के दौरान, चर के मान आउटपुट CSS दस्तावेज़ में डाले जाते हैं।<ref name="main" />
अनुवाद के समय चर के मान आउटपुट सीएसएस दस्तावेज़ में प्रसारित किये जाते हैं।<ref name="main" />


<syntaxhighlight lang="less">
<syntaxhighlight lang="less">
Line 39: Line 36:
}
}
</syntaxhighlight>
</syntaxhighlight>
उपरोक्त कोड कम में निम्नलिखित सीएसएस कोड को संकलित करेगा।
उपरोक्त कोड लेस में निम्नलिखित सीएसएस कोड को संकलित करेगा।
<syntaxhighlight lang="css">
<syntaxhighlight lang="css">
#header {
#header {
Line 67: Line 64:
}
}
</syntaxhighlight>
</syntaxhighlight>
उपरोक्त कोड कम में निम्नलिखित सीएसएस कोड को संकलित करेगा:
उपरोक्त कोड लेस में निम्नलिखित सीएसएस कोड को संकलित करेगा:
<syntaxhighlight lang="css">
<syntaxhighlight lang="css">
#header {
#header {
Line 80: Line 77:
}
}
</syntaxhighlight>
</syntaxhighlight>
लेस में विशेष प्रकार का नियम सेट होता है जिसे पैरामीट्रिक मिक्सिन्स कहा जाता है जिसे समान वर्गों में मिलाया जा सकता है, लेकिन मापदंडों को स्वीकार करता है।
लेस में विशेष प्रकार का नियम सेट होता है जिसे पैरामीट्रिक मिक्सिन्स कहा जाता है जिसे समान वर्गों में मिलाया जा सकता है, किंतु मापदंडों को स्वीकार करता है।


<syntaxhighlight lang="less">
<syntaxhighlight lang="less">
Line 101: Line 98:
}
}
</syntaxhighlight>
</syntaxhighlight>
उपरोक्त कोड कम में निम्नलिखित सीएसएस कोड को संकलित करेगा:
उपरोक्त कोड लेस में निम्नलिखित सीएसएस कोड को संकलित करेगा:


<syntaxhighlight lang="css">
<syntaxhighlight lang="css">
Line 123: Line 120:


=== कार्य और संचालन ===
=== कार्य और संचालन ===
कम संचालन और कार्यों की अनुमति देता है। संचालन संपत्ति के मूल्यों और रंगों के जोड़, घटाव, विभाजन और गुणन की अनुमति देता है, जिसका उपयोग गुणों के बीच जटिल संबंध बनाने के लिए किया जा सकता है। फ़ंक्शंस जावास्क्रिप्ट कोड के साथ एक-से-एक मैप करते हैं, जिससे मूल्यों में हेरफेर की अनुमति मिलती है।
लेस संचालन और कार्यों की अनुमति देता है। संचालन गुणों के मानो और रंगों के जोड़, घटाव, विभाजन और गुणन की अनुमति देता है, जिसका उपयोग गुणों के बीच जटिल संबंध बनाने के लिए किया जा सकता है। फ़ंक्शंस जावास्क्रिप्ट कोड के साथ एक-से-एक मैप करते हैं, जिससे मानो में हेरफेर की अनुमति मिलती है।


<syntaxhighlight lang="less">
<syntaxhighlight lang="less">
Line 140: Line 137:
}
}
</syntaxhighlight>
</syntaxhighlight>
उपरोक्त कोड कम में निम्नलिखित सीएसएस कोड को संकलित करेगा:
उपरोक्त कोड लेस में निम्नलिखित सीएसएस कोड को संकलित करेगा:


<syntaxhighlight lang="css">
<syntaxhighlight lang="css">
Line 158: Line 155:


=== सास ===
=== सास ===
Sass (स्टाइलशीट लैंग्वेज) और लेस दोनों CSS प्रीप्रोसेसर हैं, जो स्थिर नियमों के बजाय प्रोग्रामिंग निर्माण में स्वच्छ CSS लिखने की अनुमति देते हैं।<ref name="whats-wrong-with-css">{{Cite web|url=https://blog.codinghorror.com/whats-wrong-with-css/|title=सीएसएस में क्या गलत है|last=Atwood|first=Jeff|date=2010-04-30|access-date=2022-12-03|website=Coding Horror}}</ref>
सैस (स्टाइलशीट भाषा) और लेस दोनों सीएसएस प्रीप्रोसेसर हैं, जो स्थिर नियमों के अतिरिक्त प्रोग्रामिंग निर्माण में स्वच्छ सीएसएस लिखने की अनुमति देते हैं।<ref name="whats-wrong-with-css">{{Cite web|url=https://blog.codinghorror.com/whats-wrong-with-css/|title=सीएसएस में क्या गलत है|last=Atwood|first=Jeff|date=2010-04-30|access-date=2022-12-03|website=Coding Horror}}</ref>
कम सास से प्रेरित है।<ref name="about">{{Cite web|url=http://lesscss.org/about/|title=About {{!}} Less.js|author=The Core Less Team|access-date=2021-03-19|website=Less.js}}</ref><ref name="compare" />Sass को CSS को सरल और विस्तारित दोनों करने के लिए डिज़ाइन किया गया था, इसलिए घुंघराले ब्रेसिज़ जैसी चीज़ों को सिंटैक्स से हटा दिया गया था। लेस को यथासंभव सीएसएस के करीब होने के लिए डिजाइन किया गया था, और इसके परिणामस्वरूप मौजूदा सीएसएस को वैध लेस कोड के रूप में इस्तेमाल किया जा सकता है।<ref>{{Cite web|url=https://gist.github.com/674726|title=sass_and_less_compared.markdown|last=Eppstein|first=Chris|date=2010-11-10|access-date=2021-03-19|website=GitHub Gist}}</ref>
 
सैस के नए संस्करणों ने एससीएसएस (सैसी सीएसएस) नामक सीएसएस-जैसी सिंटैक्स भी पेश किया।
लेस सास से प्रेरित है।<ref name="about">{{Cite web|url=http://lesscss.org/about/|title=About {{!}} Less.js|author=The Core Less Team|access-date=2021-03-19|website=Less.js}}</ref><ref name="compare" /> सैस को सीएसएस को सरल और विस्तारित दोनों करने के लिए डिज़ाइन किया गया था इसलिए घुंघराले ब्रेसिज़ जैसी चीज़ों को सिंटैक्स से हटा दिया गया था। लेस को यथासंभव सीएसएस के समीप होने के लिए डिजाइन किया गया था, और इसके परिणामस्वरूप उपस्थित सीएसएस को वैध लेस कोड के रूप में उपयोग किया जा सकता है।<ref>{{Cite web|url=https://gist.github.com/674726|title=sass_and_less_compared.markdown|last=Eppstein|first=Chris|date=2010-11-10|access-date=2021-03-19|website=GitHub Gist}}</ref>
 
सैस के नए संस्करणों ने एससीएसएस (सैसी सीएसएस) नामक सीएसएस-जैसी सिंटैक्स भी प्रस्तुत किया जाता है।


== साइटों पर प्रयोग करें ==
== साइटों पर प्रयोग करें ==
साइटों पर कई तरीकों से कम लागू किया जा सकता है। कोड को ऑन-द-फ्लाई में बदलने के लिए विकल्प कम.js जावास्क्रिप्ट फ़ाइल को शामिल करना है। ब्राउजर तब आउटपुट सीएसएस प्रस्तुत करता है।
साइटों पर कई विधि से लेस प्रयुक्त किया जा सकता है। कोड को ऑन-द-फ्लाई में बदलने के लिए विकल्प लेस.जेएस जावास्क्रिप्ट फ़ाइल को सम्मिलित करना है। ब्राउजर तब आउटपुट सीएसएस प्रस्तुत करता है।
एक अन्य विकल्प कम कोड को शुद्ध CSS में प्रस्तुत करना और CSS को साइट पर अपलोड करना है। इस विकल्प के साथ कोई .less फ़ाइलें अपलोड नहीं की जाती हैं और साइट को less.js JavaScript कन्वर्टर की आवश्यकता नहीं होती है।


== कम सॉफ्टवेयर ==
एक अन्य विकल्प लेस कोड को शुद्ध सीएसएस में प्रस्तुत करना और सीएसएस को साइट पर अपलोड करना है। इस विकल्प के साथ कोई .लेस फ़ाइलें अपलोड नहीं की जाती हैं और साइट को लेस.जेएस जावास्क्रिप्ट कन्वर्टर की आवश्यकता नहीं होती है।
 
== लेस सॉफ्टवेयर ==
{| class="wikitable sortable"
{| class="wikitable sortable"
|-
|-
! Name !! Description !! Software License !! Platform !! Functionality
! नाम !! विवरण !! सॉफ़्टवेयर लाइसेंस !! प्लैटफ़ॉर्म !! कार्यक्षमता
|-
|-
| WinLess - Windows GUI for less.js || GUI Less Compiler || [[Apache License|Apache 2.0]]<ref>{{Cite web|url=https://github.com/marklagendijk/WinLess/issues/55#issuecomment-12863789|title=License Information · Issue #55 · marklagendijk/WinLess|last=Lagendijk|first=Mark|date=2013-01-29|access-date=2021-03-19|website=GitHub}}</ref> || Windows || Compiler
| विन्लेस- लेस .जेएस के लिए विंडोज़ जीयूआई || जीयूआई लेस  कंपाइलर || [[Apache License|अपाचे 2.0]]<ref>{{Cite web|url=https://github.com/marklagendijk/WinLess/issues/55#issuecomment-12863789|title=License Information · Issue #55 · marklagendijk/WinLess|last=Lagendijk|first=Mark|date=2013-01-29|access-date=2021-03-19|website=GitHub}}</ref> || विंडोज || कंपाइलर
|-
|-
| Crunch || Less editor and compiler (requires Adobe AIR) ||[[GPL]]<ref>{{Cite web|url=https://github.com/matthew-dean/Crunch/blob/master/LICENSE.txt|title=Crunch/LICENSE.txt at master · matthew-dean/Crunch|last=Dean|first=Matthew|date=2011-12-02|access-date=2021-03-19|website=GitHub}}</ref> || Windows, Mac OS X || Compiler<br />Editor
| क्रंच || लेस  संपादक और कंपाइलर (एडोब एआईआर की आवश्यकता है) ||[[GPL|जीपीएल]]<ref>{{Cite web|url=https://github.com/matthew-dean/Crunch/blob/master/LICENSE.txt|title=Crunch/LICENSE.txt at master · matthew-dean/Crunch|last=Dean|first=Matthew|date=2011-12-02|access-date=2021-03-19|website=GitHub}}</ref> || विंडोज, मैक ओएस एक्स || कंपाइलर<br />एडिटर
|-
|-
| less.js-windows || Simple command-line utility for Windows that will compile *.less files to CSS using less.js. ||[[MIT License]]<ref>{{Cite web|url=https://github.com/duncansmart/less.js-windows/blob/master/LICENSE|title=less.js-windows/LICENSE at master · duncansmart/less.js-windows|last=Smart|first=Duncan|date=2013-07-25|access-date=2021-03-19|website=GitHub}}</ref> ||Windows || Compiler
| लेस .जेएस-विंडोज़ || विंडोज़ के लिए सरल कमांड-लाइन उपयोगिता जो लेस .जेएस का उपयोग करके *.लेस फ़ाइलों को सीएसएस में संकलित करेगी। ||[[MIT License|एमआईटी लाइसेंस]]<ref>{{Cite web|url=https://github.com/duncansmart/less.js-windows/blob/master/LICENSE|title=less.js-windows/LICENSE at master · duncansmart/less.js-windows|last=Smart|first=Duncan|date=2013-07-25|access-date=2021-03-19|website=GitHub}}</ref> ||विंडोज || कंपाइलर
|-
|-
| less.app || Less Compiler || Proprietary || Mac OS X || Compiler
| लेस.एप्प || कम कंपाइलर || स्वामित्व || मैक ओएस एक्स || कंपाइलर
|-
|-
| CodeKit || Less Compiler || Proprietary || Mac OS X || Compiler
| कोडकिट || लेस कंपाइलर || स्वामित्व || मैक ओएस एक्स || कंपाइलर
|-
|-
| LessEngine || Less Compiler || Free || OpenCart Plugin || Compiler
| लेसइंजन || लेस कंपाइलर || मुक्त || ओपनकार्ट प्लगइन || कंपाइलर
|-
|-
| SimpLESS || Less Compiler || free but no explicit license<ref>{{Cite web|url=https://github.com/Paratron/SimpLESS/blob/master/LICENSE.txt|title=SimpLESS/LICENSE.txt at master · Paratron/SimpLESS|last=Engel|first=Christian|date=2012-07-29|access-date=2021-03-19|website=GitHub}}</ref>|| Windows<br />Mac OS X<br />Linux || Compiler
| सिम्प्लेस  || लेस कंपाइलर || निःशुल्क परंतु कोई स्पष्ट लाइसेंस नहीं<ref>{{Cite web|url=https://github.com/Paratron/SimpLESS/blob/master/LICENSE.txt|title=SimpLESS/LICENSE.txt at master · Paratron/SimpLESS|last=Engel|first=Christian|date=2012-07-29|access-date=2021-03-19|website=GitHub}}</ref>|| विंडोज<br />मैक ओएस एक्स<br />लिनक्स || कंपाइलर
|-
|-
| Chirpy || Less Compiler ||[[Shared source#Microsoft Public License .28Ms-PL.29|Ms-PL]]<ref>{{Cite web|url=https://archive.codeplex.com/?p=chirpy|archive-url=https://web.archive.org/web/20210220115440/https://archive.codeplex.com/?p=chirpy|archive-date=2021-02-20|title=Chirpy - VS Add In For Handling Js, Css, DotLess, and T4 Files - CodePlex Archive|author=Evan Nagle|access-date=2021-03-19|website=CodePlex}}</ref> || Visual Studio Plugin || Compiler
| चिरपी || लेस कंपाइलर ||[[Shared source#Microsoft Public License .28Ms-PL.29|एमएस-पीएल]]<ref>{{Cite web|url=https://archive.codeplex.com/?p=chirpy|archive-url=https://web.archive.org/web/20210220115440/https://archive.codeplex.com/?p=chirpy|archive-date=2021-02-20|title=Chirpy - VS Add In For Handling Js, Css, DotLess, and T4 Files - CodePlex Archive|author=Evan Nagle|access-date=2021-03-19|website=CodePlex}}</ref> || विजुअल स्टूडियो प्लगइन || कंपाइलर
|-
|-
| Mindscape Web Workbench || [[Syntax highlighting]] and IntelliSense for Less and Sass || Proprietary || Visual Studio Plugin || Compiler<br />Syntax Highlighting
| माइंडस्केप वेब कार्यक्षेत्र || लेस और सैस के लिए सिंटैक्स हाइलाइटिंग और इंटेलीसेन्स || स्वामित्व || विजुअल स्टूडियो प्लगइन || कम्पायलर
वाक्य - विन्यास पर प्रकाश डालना
|-
|-
| Eclipse Plugin for Less|| Eclipse Plugin ||[[Eclipse Public License|EPL 1.0]]<ref>{{Cite web|url=http://www.normalesup.org/~simonet/soft/ow/eclipse-less.html|title=Eclipse plugin for LESS|author=Vincent Simonet|access-date=2021-03-19|website=normalesup.org}}</ref> || Eclipse Plugin || Syntax highlighting<br />Content assist<br />Compiler
| लेस में एक्लिप्स प्लगइन|| एक्लिप्स प्लगइन ||[[Eclipse Public License|ईपीएल1.0]]<ref>{{Cite web|url=http://www.normalesup.org/~simonet/soft/ow/eclipse-less.html|title=Eclipse plugin for LESS|author=Vincent Simonet|access-date=2021-03-19|website=normalesup.org}}</ref> || एक्लिप्स प्लगइन || वाक्य - विन्यास पर प्रकाश डालना
सामग्री सहायता
 
कम्पायलर
|-
|-
| mod_less || Apache2 module to compile Less on the fly || Open Source || Linux || Compiler
| मॉड_लेस || अपाचे2 मॉड्यूल तुरंत कम संकलित करने के लिए || विवर्त  स्त्रोत || लिनक्स || कंपाइलर
|-
|-
| grunt-contrib-less || Node.js Grunt task to convert Less to CSS || [[MIT License|MIT]]<ref>{{Cite web|url=https://github.com/gruntjs/grunt-contrib-less/blob/master/LICENSE-MIT|title=grunt-contrib-less/LICENSE-MIT at master · gruntjs/grunt-contrib-less|last=Kellen|first=Tyler|date=2012-09-04|access-date=2021-03-19|website=GitHub}}</ref> || Node.js || Compiler
| ग्रन्ट-योगदान-रहित || नोड.जेएस ग्रंट कार्य लेस को CSS में परिवर्तित करने के लिए || [[MIT License|एमआईटी]]<ref>{{Cite web|url=https://github.com/gruntjs/grunt-contrib-less/blob/master/LICENSE-MIT|title=grunt-contrib-less/LICENSE-MIT at master · gruntjs/grunt-contrib-less|last=Kellen|first=Tyler|date=2012-09-04|access-date=2021-03-19|website=GitHub}}</ref> || नोड.जेएस || कंपाइलर
|-
|-
| Web Essentials || Visual Studio extension with support for Less and Sass || Apache 2.0 <ref>{{Cite web|url=https://github.com/madskristensen/WebEssentials2013/blob/master/LICENSE.txt|title=WebEssentials2013/LICENSE.txt at master · madskristensen/WebEssentials2013|last=Kristensen|first=Mads|date=2014-06-18|access-date=2021-03-19|website=GitHub}}</ref> || Windows || Syntax highlighting, Content assist, Compiler
| वेब अनिवार्यताएँ || लेस और सैस के समर्थन के साथ विजुअल स्टूडियो एक्सटेंशन || अपाचे 2.0 <ref>{{Cite web|url=https://github.com/madskristensen/WebEssentials2013/blob/master/LICENSE.txt|title=WebEssentials2013/LICENSE.txt at master · madskristensen/WebEssentials2013|last=Kristensen|first=Mads|date=2014-06-18|access-date=2021-03-19|website=GitHub}}</ref> || विंडोज || सिंटेक्स हाइलाइटिंग, कंटेंट असिस्ट, कंपाइलर
|-
|-
| clessc || Pure C++ compiler || [[MIT License|MIT]]<ref>{{Cite web|url=https://github.com/BramvdKroef/clessc/blob/master/LICENSE|title=clessc/LICENSE at master · BramvdKroef/clessc|author=Bram van der Kroef|date=2017-07-11|access-date=2021-03-19|website=GitHub}}</ref> || at least Windows, Linux, MacOS || Compiler
| क्लेस्स्क || शुद्ध C++ कंपाइलर || [[MIT License|एमआईटी]]<ref>{{Cite web|url=https://github.com/BramvdKroef/clessc/blob/master/LICENSE|title=clessc/LICENSE at master · BramvdKroef/clessc|author=Bram van der Kroef|date=2017-07-11|access-date=2021-03-19|website=GitHub}}</ref> || कम से कम विंडोज़, लिनक्स, मैकओएस || कंपाइलर
|-
|-
| Less WebCompiler || Web-based compiler || [[MIT License|MIT]]<ref>{{Cite web|url=https://github.com/pytesNET/snout.less/blob/master/LICENSE.md|title=snout.less/LICENSE.md at master · pytesNET/snout.less|author=SamBrishes|date=2018-12-15|access-date=2021-03-19|website=GitHub}}</ref> || at least Windows, Linux, MacOS || Compiler, Syntax highlighting, Minifier
| लेस  वेबकंपाइलर || वेब-आधारित कंपाइलर || [[MIT License|एमआईटी]]<ref>{{Cite web|url=https://github.com/pytesNET/snout.less/blob/master/LICENSE.md|title=snout.less/LICENSE.md at master · pytesNET/snout.less|author=SamBrishes|date=2018-12-15|access-date=2021-03-19|website=GitHub}}</ref> || कम से कम विंडोज़, लिनक्स, मैकओएस || कंपाइलर, सिंटेक्स हाइलाइटिंग, मिनिफायर
|}
|}



Revision as of 09:28, 24 June 2023

Less
LESS Logo.svg
द्वारा डिज़ाइन किया गयाAlexis Sellier
DeveloperAlexis Sellier, Dmitry Fadeyev
पहली प्रस्तुतिScript error: The module returned a nil value. It is supposed to return an export table.; Error: first parameter cannot be parsed as a date or time. (Script error: The module returned a nil value. It is supposed to return an export table.)
Stable release
Script error: The module returned a nil value. It is supposed to return an export table. / Script error: The module returned a nil value. It is supposed to return an export table.; Error: first parameter cannot be parsed as a date or time. (Script error: The module returned a nil value. It is supposed to return an export table.)
टाइपिंग अनुशासनDynamic
कार्यान्वयन भाषाJavaScript
ओएसCross-platform
लाइसेंसApache License 2.0
फ़ाइल नाम एक्सटेंशनएस.less
वेबसाइटlesscss.org
Influenced by
CSS, Sass
Influenced
Sass, Less Framework, Bootstrap (v3)

लेस (लीनर स्टाइल शीट; कभी-कभी लेस के रूप में शैलीबद्ध) गतिशील प्रीप्रोसेसर स्टाइल शीट भाषा है जिसे कैस्केडिंग स्टाइल शीट्स (सीएसएस) में संकलित किया जा सकता है और क्लाइंट साइड या सर्वर साइड पर चलाया जा सकता है।[1] एलेक्सिस सेलियर द्वारा डिज़ाइन किया गया, लेस सैस (स्टाइलशीट भाषा) से प्रभावित है और इसने सैस के नए एससीएसएस सिंटैक्स को प्रभावित किया है, जिसने इसके सीएसएस-जैसे ब्लॉक फ़ॉर्मेटिंग सिंटैक्स को अनुकूलित किया है।[2] लेस ओपन सोर्स प्रोजेक्ट है। इसका पहला संस्करण रूबी (प्रोग्रामिंग भाषा) में लिखा गया था; चूँकि, बाद के संस्करणों में, रूबी का उपयोग बहिष्कृत कर दिया गया है और जावास्क्रिप्ट द्वारा प्रतिस्थापित किया गया है। लेस का इंडेंट सिंटैक्स मेटलंग्वेज या नेस्टेड है, क्योंकि वैध सीएसएस प्रोग्रामिंग भाषाओं के समान शब्दार्थ के साथ वैध लेस कोड है। लेस निम्नलिखित तंत्र प्रदान करता है: चर (प्रोग्रामिंग), नेस्टिंग (कंप्यूटिंग) प्रोग्रामिंग में, मिश्रण, ऑपरेटर (प्रोग्रामिंग) और फ़ंक्शन (कंप्यूटर विज्ञान); लेस और अन्य सीएसएस प्रीकंपाइलर के बीच मुख्य अंतर यह है कि लेस ब्राउज़र द्वारा लेस.जेएस के माध्यम से रीयल-टाइम संकलन की अनुमति देता है।[1][3]

सुविधाएँ

चर

लेस चर को परिभाषित करने की अनुमति देता है। लेस में वेरिएबल्स को चिह्न (@) के साथ परिभाषित किया गया है। वेरिएबल असाइनमेंट (कंप्यूटर प्रोग्रामिंग) कोलन (विराम चिह्न) (:) के साथ किया जाता है।

अनुवाद के समय चर के मान आउटपुट सीएसएस दस्तावेज़ में प्रसारित किये जाते हैं।[1]

@pale-green-color: #4D926F;

#header {
  color: @pale-green-color;
}
h2 {
  color: @pale-green-color;
}

उपरोक्त कोड लेस में निम्नलिखित सीएसएस कोड को संकलित करेगा।

#header {
  color: #4D926F;
}
h2 {
  color: #4D926F;
}


मिश्रण

मिक्सिन्स वर्ग के सभी गुणों को अपनी संपत्ति में से के रूप में वर्ग नाम सहित किसी अन्य वर्ग में एम्बेड करने की अनुमति देता है, इस प्रकार प्रकार का कॉन्स्टेंट (प्रोग्रामिंग) या चर के रूप में व्यवहार करता है। वे कार्यों की तरह भी व्यवहार कर सकते हैं और तर्क ले सकते हैं। सीएसएस मिक्सिन्स का समर्थन नहीं करता है: किसी भी दोहराए गए कोड को प्रत्येक स्थान पर दोहराया जाना चाहिए। मिक्सिन्स अधिक कुशल और स्वच्छ कोड दोहराव के साथ-साथ कोड के आसान परिवर्तन की अनुमति देता है।[1]

.rounded-corners (@radius: 5px 10px 8px 2px) {
  -webkit-border-radius: @radius;
  -moz-border-radius: @radius;
  border-radius: @radius;
}

#header {
  .rounded-corners;
}
#footer {
  .rounded-corners(10px 25px 35px 0px);
}

उपरोक्त कोड लेस में निम्नलिखित सीएसएस कोड को संकलित करेगा:

#header {
  -webkit-border-radius: 5px 10px 8px 2px;
  -moz-border-radius: 5px 10px 8px 2px;
  border-radius: 5px 10px 8px 2px;
}
#footer {
  -webkit-border-radius: 10px 25px 35px 0px;
  -moz-border-radius: 10px 25px 35px 0px;
  border-radius: 10px 25px 35px 0px;
}

लेस में विशेष प्रकार का नियम सेट होता है जिसे पैरामीट्रिक मिक्सिन्स कहा जाता है जिसे समान वर्गों में मिलाया जा सकता है, किंतु मापदंडों को स्वीकार करता है।

#header {
  h1 {
    font-size: 26px;
    font-weight: bold;
  }
  p {
    font-size: 16px;
    a {
      text-decoration: none;
      color: red;
      &:hover {
        border-width: 1px;
        color: #fff;
      }
    }
  }
}

उपरोक्त कोड लेस में निम्नलिखित सीएसएस कोड को संकलित करेगा:

#header h1 {
  font-size: 26px;
  font-weight: bold;
}
#header p {
  font-size: 16px;
}
#header p a {
  text-decoration: none;
  color: red;
}
#header p a:hover {
  border-width: 1px;
  color: #fff;
}


कार्य और संचालन

लेस संचालन और कार्यों की अनुमति देता है। संचालन गुणों के मानो और रंगों के जोड़, घटाव, विभाजन और गुणन की अनुमति देता है, जिसका उपयोग गुणों के बीच जटिल संबंध बनाने के लिए किया जा सकता है। फ़ंक्शंस जावास्क्रिप्ट कोड के साथ एक-से-एक मैप करते हैं, जिससे मानो में हेरफेर की अनुमति मिलती है।

@the-border: 1px;
@base-color: #111;
@red:        #842210;

#header {
  color: @base-color * 3;
  border-left: @the-border;
  border-right: @the-border * 3;
}
#footer {
  color: @base-color + #003300;
  border-color: desaturate(@red, 10%);
}

उपरोक्त कोड लेस में निम्नलिखित सीएसएस कोड को संकलित करेगा:

#header {
  color: #333;
  border-left: 1px;
  border-right: 3px;
}
#footer {
  color: #114411;
  border-color: #7d2717;
}


तुलना

सास

सैस (स्टाइलशीट भाषा) और लेस दोनों सीएसएस प्रीप्रोसेसर हैं, जो स्थिर नियमों के अतिरिक्त प्रोग्रामिंग निर्माण में स्वच्छ सीएसएस लिखने की अनुमति देते हैं।[4]

लेस सास से प्रेरित है।[5][2] सैस को सीएसएस को सरल और विस्तारित दोनों करने के लिए डिज़ाइन किया गया था इसलिए घुंघराले ब्रेसिज़ जैसी चीज़ों को सिंटैक्स से हटा दिया गया था। लेस को यथासंभव सीएसएस के समीप होने के लिए डिजाइन किया गया था, और इसके परिणामस्वरूप उपस्थित सीएसएस को वैध लेस कोड के रूप में उपयोग किया जा सकता है।[6]

सैस के नए संस्करणों ने एससीएसएस (सैसी सीएसएस) नामक सीएसएस-जैसी सिंटैक्स भी प्रस्तुत किया जाता है।

साइटों पर प्रयोग करें

साइटों पर कई विधि से लेस प्रयुक्त किया जा सकता है। कोड को ऑन-द-फ्लाई में बदलने के लिए विकल्प लेस.जेएस जावास्क्रिप्ट फ़ाइल को सम्मिलित करना है। ब्राउजर तब आउटपुट सीएसएस प्रस्तुत करता है।

एक अन्य विकल्प लेस कोड को शुद्ध सीएसएस में प्रस्तुत करना और सीएसएस को साइट पर अपलोड करना है। इस विकल्प के साथ कोई .लेस फ़ाइलें अपलोड नहीं की जाती हैं और साइट को लेस.जेएस जावास्क्रिप्ट कन्वर्टर की आवश्यकता नहीं होती है।

लेस सॉफ्टवेयर

नाम विवरण सॉफ़्टवेयर लाइसेंस प्लैटफ़ॉर्म कार्यक्षमता
विन्लेस- लेस .जेएस के लिए विंडोज़ जीयूआई जीयूआई लेस कंपाइलर अपाचे 2.0[7] विंडोज कंपाइलर
क्रंच लेस संपादक और कंपाइलर (एडोब एआईआर की आवश्यकता है) जीपीएल[8] विंडोज, मैक ओएस एक्स कंपाइलर
एडिटर
लेस .जेएस-विंडोज़ विंडोज़ के लिए सरल कमांड-लाइन उपयोगिता जो लेस .जेएस का उपयोग करके *.लेस फ़ाइलों को सीएसएस में संकलित करेगी। एमआईटी लाइसेंस[9] विंडोज कंपाइलर
लेस.एप्प कम कंपाइलर स्वामित्व मैक ओएस एक्स कंपाइलर
कोडकिट लेस कंपाइलर स्वामित्व मैक ओएस एक्स कंपाइलर
लेसइंजन लेस कंपाइलर मुक्त ओपनकार्ट प्लगइन कंपाइलर
सिम्प्लेस लेस कंपाइलर निःशुल्क परंतु कोई स्पष्ट लाइसेंस नहीं[10] विंडोज
मैक ओएस एक्स
लिनक्स
कंपाइलर
चिरपी लेस कंपाइलर एमएस-पीएल[11] विजुअल स्टूडियो प्लगइन कंपाइलर
माइंडस्केप वेब कार्यक्षेत्र लेस और सैस के लिए सिंटैक्स हाइलाइटिंग और इंटेलीसेन्स स्वामित्व विजुअल स्टूडियो प्लगइन कम्पायलर

वाक्य - विन्यास पर प्रकाश डालना

लेस में एक्लिप्स प्लगइन एक्लिप्स प्लगइन ईपीएल1.0[12] एक्लिप्स प्लगइन वाक्य - विन्यास पर प्रकाश डालना

सामग्री सहायता

कम्पायलर

मॉड_लेस अपाचे2 मॉड्यूल तुरंत कम संकलित करने के लिए विवर्त स्त्रोत लिनक्स कंपाइलर
ग्रन्ट-योगदान-रहित नोड.जेएस ग्रंट कार्य लेस को CSS में परिवर्तित करने के लिए एमआईटी[13] नोड.जेएस कंपाइलर
वेब अनिवार्यताएँ लेस और सैस के समर्थन के साथ विजुअल स्टूडियो एक्सटेंशन अपाचे 2.0 [14] विंडोज सिंटेक्स हाइलाइटिंग, कंटेंट असिस्ट, कंपाइलर
क्लेस्स्क शुद्ध C++ कंपाइलर एमआईटी[15] कम से कम विंडोज़, लिनक्स, मैकओएस कंपाइलर
लेस वेबकंपाइलर वेब-आधारित कंपाइलर एमआईटी[16] कम से कम विंडोज़, लिनक्स, मैकओएस कंपाइलर, सिंटेक्स हाइलाइटिंग, मिनिफायर


यह भी देखें

संदर्भ

  1. 1.0 1.1 1.2 1.3 The Core Less Team. "Getting started | Less.js". Less.js. Retrieved 2021-03-19.
  2. 2.0 2.1 Weizenbaum, Nathan (2009-06-17). "Sass and Less : Nex3". Archived from the original on 2009-06-21. Retrieved 2021-03-19.
  3. Meng, Jiew (2010-12-14). Mortensen, Peter (ed.). "css - Is there a SASS.js? Something like LESS.js?". Stack Overflow. Retrieved 2021-03-19.
  4. Atwood, Jeff (2010-04-30). "सीएसएस में क्या गलत है". Coding Horror. Retrieved 2022-12-03.
  5. The Core Less Team. "About | Less.js". Less.js. Retrieved 2021-03-19.
  6. Eppstein, Chris (2010-11-10). "sass_and_less_compared.markdown". GitHub Gist. Retrieved 2021-03-19.
  7. Lagendijk, Mark (2013-01-29). "License Information · Issue #55 · marklagendijk/WinLess". GitHub. Retrieved 2021-03-19.
  8. Dean, Matthew (2011-12-02). "Crunch/LICENSE.txt at master · matthew-dean/Crunch". GitHub. Retrieved 2021-03-19.
  9. Smart, Duncan (2013-07-25). "less.js-windows/LICENSE at master · duncansmart/less.js-windows". GitHub. Retrieved 2021-03-19.
  10. Engel, Christian (2012-07-29). "SimpLESS/LICENSE.txt at master · Paratron/SimpLESS". GitHub. Retrieved 2021-03-19.
  11. Evan Nagle. "Chirpy - VS Add In For Handling Js, Css, DotLess, and T4 Files - CodePlex Archive". CodePlex. Archived from the original on 2021-02-20. Retrieved 2021-03-19.
  12. Vincent Simonet. "Eclipse plugin for LESS". normalesup.org. Retrieved 2021-03-19.
  13. Kellen, Tyler (2012-09-04). "grunt-contrib-less/LICENSE-MIT at master · gruntjs/grunt-contrib-less". GitHub. Retrieved 2021-03-19.
  14. Kristensen, Mads (2014-06-18). "WebEssentials2013/LICENSE.txt at master · madskristensen/WebEssentials2013". GitHub. Retrieved 2021-03-19.
  15. Bram van der Kroef (2017-07-11). "clessc/LICENSE at master · BramvdKroef/clessc". GitHub. Retrieved 2021-03-19.
  16. SamBrishes (2018-12-15). "snout.less/LICENSE.md at master · pytesNET/snout.less". GitHub. Retrieved 2021-03-19.


बाहरी संबंध