CSS از عبارت Cascading Style Sheets گرفته شده است که در فارسی “شیوه نامه آبشاری” نامیده می شود و با استفاده از آن می توان نوع متن، رنگ و نحوه چینش نوشته ها و نیز سایر اجزا صفحه مانند جداول، تصاویر و … را کنترل کرد. همچنین این زبان قادر به ایجاد افکت ها و انیمیشن های پیشرفته می باشد. تنها ضعف CSS حالت ایستایی و یکنواختی آن می باشد.
تصور کنید که بتوانید با CSS برنامه نویسی کنید، بتوانید متغیر تعریف کنید و در برنامه خود از این متغیر یا متغیرها استفاده کنید و یا توابعی را تعریف کنید و این توابع را در برنامه فراخوانی کنید. در این صورت هنگامی که احساس کردید نیاز به تغییر دارید فقط کافی است متغیر را تغییر دهید یا در تابعی که تعریف کردید تغییرات یا اصلاحاتی را انجام دهید. در نتیجه در نوشتن CSS سریع تر می شوید و شما به یک طراح حرفه ای تبدیل می شوید.
LESS یک ابزار (کتابخانه) جاوا اسکریپت کوچک است که قابلیت هایی همچون متغیرها، عملگرها، Mixin ها و دستورات تو در تو را برای CSS فراهم می کند به این معنی که می توانید کدهای CSS را بسیار شبیه زبان های برنامه نویسی همچون PHP بنویسید.
LESS یک زبان استایل نویسی پویا می باشد که توسط Sellier Alexis طراحی شده است که قابلیت Compile شدن به CSS را دارد. LESS دارای دو نوع پیاده سازی است:
۱- سمت سرور
۲- سمت کاربر
پیاده سازی سمت سرور توسط Node.js انجام شده است و پیاده سازی سمت کاربر توسط جاوا اسکریپت انجام می شود.
فهرست سرفصل ها و رئوس مطالب مطرح شده در این مجموعه آموزشی، در ادامه آمده است:
- درس یکم: معرفی LESS ، آماده سازی محیط کار
- معرفی دانلود و نصب نرم افزار Phpstorm
- مفهوم پیش پردازنده (Preprocessor)
- معرفی تعدادی از پیش پردازنده ها (Preprocessor ها)
- مزیت ها و دلایل استفاده از Preprocessor
- LESS چیست؟
- چرا از LESS استفاده کنیم ؟
- دانلود LESS
- اتصال فایل LESS به سند
- درس دوم: متغیرها ، پارامترها ، Mixin ها
- نوشتن کامنت در فایل های LESS
- نصب و آموزش پلاگین LESS CSS Compiler داخل نرم افزار Phpstorm
- متغیرها و چگونگی تعریف آن ها در فایل های LESS
- بکار بردن همزمان دستورات CSS و متغیرها
- تعریف پراپرتی های CSS درون متغیر
- توضیح Lazy load بودن متغیرها
- توضیح ترتیب اعمال مقادیر متغیرهای مشابه به المان ها
- توضیح Scope
- شرح خطاهای دستوری و خطاهای رایج در هنگام نوشتن دستورات LESS شرح پیام های خطا و چگونگی حل این پیام ها
- فضای نام در Mixin
- شرح Mixin ها , کاربرد آن ها و تعریف متغیرهای مختلف درون آن برای کاهش کدنویسی خصوصیات مشابه و مقادیر برابر
- شرح Mixin ها , و چگونگی استفاده از آن ها برای کاهش کدنویسی
- چگونگی ارسال پارامتر بصورت واحد
- چگونگی ارسال پارامتر بصورت گروهی
- چگونگی ارسال متغیرها درون Mixin ها
- استفاده از Mixin ها بعنوان توابع
- چگونگی تعیین مقدار اولیه برای پارامتر های Mixin های ایجاد شده و کاهش کدنویسی خصوصیات مشابه
- شرح و چگونگی ایجاد دستورات شرطی برای تغییر خصوصیات مشابه عناصر مختلف در سند و استفاده ترکیبی آن درMixin ها
- چگونگی وارد کردن چندین فایل جداگانه LESS در فایل اصلی و شرح مزیت این کار
- درس سوم: توابع و عملگرهای محاسباتی در LESS
- توابع ریاضی
- ceil
- floor
- percentage
- round
- sqrt
- abs
- sin
- asin
- cos
- acos
- tan
- atan
- pi
- pow
- mod
- min
- max
- توابع نوع
- isnumber
- isstring
- iscolor
- iskeyword
- isurl
- ispixel
- isem
- ispercentage
- isunit
- isruleset
- توابع تعریف رنگ rgb
- rgba
- argb
- hsl
- hsla
- hsv
- hsva
- Color channel function و color operation functions
- hue
- saturation
- lightness
- alfa
- lighten
- darken
- saturate
- desaturate
- fadein
- fadeout
- spin
- mix
- shade
- greyscale
- contrast
- Color blending functions
- multipy
- screen
- overlay
- softlight
- hardlight
- difference
- exclusion
- average
- negation
- توابع ریاضی
- درس چهارم: Nesting در LESS
- Nesting چیست؟
- استفاده از Nesting برای سلکتور های واحد
- استفاده از Nesting برای سلکتور های گروهی
- چگونگی ایجاد Pseudo Class ها
- شرح Extended Pseudo Class
- درس پنجم: پروژه پایان دوره
- پروژه طراحی قالب تحت LESS
- شرح تفاوت قالب طراحی شده تحت LESS با قالب طراحی شده بدون استفاده از LESS
مفید برای رشته های
- مهندسی کامپیوتر
- مهندسی فناوری اطلاعات
میلاد :
سلام
خواهشا زود تر این اموزش رو اماده کنید
ممنون میشم