لس

لس (زبان برنامه نویسی). Less ( گاهی اوقات به صورت LESS ) یک زبان پویای style sheet است که می تواند به صورت شیوه نامه های آبشاری ( CSS ) کامپایل شود در سمت کلاینت یا سرور اجرا شود. [ ۱] Less توسط الکسیس سلیر طراحی شده است. Less از Sass تأثیر گرفته است و بر سینتکس جدیدتر "SCSS" از Sass تأثیر گذاشته است، که سازگار با سینتکس قالب بندی بلاک CSS - like است. [ ۲] Less متن باز است. اولین نسخهٔ آن با زبان روبی نوشته شده است؛ اما در نسخه های بعدی استفاده از روبی پایان یافت و با جاوا اسکریپت جایگزین شد. سینتکس فاصله گذاری Less به صورت یک فرازبان تو در تو است به صورتی که CSS معتبر یک کد معتبر Less با معانی مشابه است. Less این مکانیزم ها را فراهم می کند: متغیر، nesting, mixins, operators و توابع؛ تفاوت اصلی بین Less و سایر زبان های CSS پیش کامپایل این است که Less اجازه می دهد که کامپایل به صورت real - time از طریق less. js توسط مرورگر انجام شود. [ ۳]
Less اجازه می دهد که متغیر تعریف شود. متغیرها در Less با یک علامت ( @ ) تعریف می شوند. متغیر با یک علامت دونقطه ( : ) مقداردهی می شود.
در حین ترجمه، مقادیر متغیرها به فایل خروجی CSS وارد می شوند.
@pale - green - color: #4D926F; #header { color: @pale - green - color; } h2 { color: @pale - green - color; } کد بالا در Less که به کد زیر در CSS کامپایل می شود.
#header { color: #4D926F; } h2 { color: #4D926F; } مکسین ها مکسین ها اجازه می دهند که همهٔ خصوصیات یک کلاس از طریق وارد کردن نام کلاس به عنوان یکی از خصوصیاتش وارد کلاس دیگر شود، بنابراین به عنوان یک نوع ثابت یا متغیر رفتار می کند. همچنین می توانند مانند توابع رفتار کنند و آرگومان بگیرند. CSS از مکسین ها پشتیبانی نمی کند. هر کد تکرارشونده ای باید در جای خود تکرار شود. مکسین ها اجازه می دهند که کد کارآمدتر و تکرار در کد تمیز باشد، و همچنین تغییر کد راحت تر باشد.
. 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 ) ; } کد بالا در Less که به کد زیر در CSS کامپایل می شود.
#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; } Less یک نوع خاص از مجموعه قوانین به نام مکسین های پارامتری دارد که می تواند مانند کلاس ها میکس شود، اما پارامتر قبول کند.