آموزش less از صفر تا صد با 12 درس رایگان

رتبه: 0 ار 0 رای sssss
آموزش لس
نویسنده: میلاد حیدری زمان مطالعه 2 دقیقه
Banner Image

اگر شما به عنوان یک توسعه دهنده وب فعالیت میکنید، هنگام کار با CSS با استایل های تکراری روبروخواهید شد. گاهی تغییر این استایل ها نیازمند زمان زیادی است و باید خطوط زیادی اصلاح شوند. Less در واقع یک زبان پیش پردازنده است و میتوانید به وسیله آن در CSS استایل های جدید ایجاد کنید. در این مقاله سعی داریم تا Less را به طور کامل شرح دهیم.

LESS چیست؟

LESSمخفف عبارت Leaner Style Sheets و یک زبان پیش‌پردازنده برای CSS است. شما با کمک این زبان میتوانید قابلیت هایی را به CSSاضافه کنید. در واقع هدف از Less را میتوان ساده کردن کدنویسی استایل ها در صفحات ب دانست.

Less بسیاری از امکانات یک زبان برنامه نویسی مانند تعریف متغیر، ترکیب متغیرها و بسیاری ویژگی های دیگر را برای نوشتن کدهای CSS بکار می برد، تا بتوان کدهای استایل دهی را سریع تر و خوانا تر نوشت. کامپايلر اصلي LESS با استفاده از جاوا اسکريپت نوشته شده است و کد هاي نگارش يافته را به فرمت استاندارد CSS تبديل مي‎کند.

آموزش Css کاملا رایگان از ابتدا

کاربردهای LESS

1- به کمک LESS میتوان کدهایCSS را مانند دیگر زبان های برنامه نویسی همچون PHP نوشت.

2- LESS به نوشتن بهتر کدهای CSSکمک مکیند و میتوان از CSS3 بهتر استفاده کرد.

3- با کمک LESS میتوان متغیرها را همچون PHP استفاده کرد.

نحوه نصب LESS

مرحله اول  دانلود فایل های مورد نیاز از سایتhttps://lesscss.org/.

مرحله دوم  از فایل less.js یک کپی بگیرید و داخل پوشه سایت خود قرار دهید.

مرحله سوم  یک فایل ایجاد نمایید و استایل های خود را به صورت style.less بنویسید.

مرحله چهارم  کد زیر را در کد های HTML خود وارد نمایید.

<head>

<link rel=”stylesheet/less” type=”text/css” href=”styles.less”>

<script src=”less.js” type=”text/javascript”></script>

</head>

نحوه استفاده کردن از LESS در پروژه

مرورگرها کدی به نام LESS را درک نمی‌کنند. بنابراین برای اجرای این کد ۲ راه وجود دارد تا این کدها به css تبدیل شوند:

1- اگر از node.js استفاده می‌کنید کافیست دستور زیر را در آن اجرا کنید:

npm install -g less

> lessc styles.less styles.css

۲- در هدر قالب خود (درون تگ <head></head>) دو خط کد زیر را اضافه کنید:

<link rel=”stylesheet/less” type=”text/css” href=”styles.less” />

<script src=”//cdnjs.cloudflare.com/ajax/libs/less.js/3.9.0/less.min.js” ></script>

اکنون LESS در دسترس شماست.

 

مزایای استفاده از less اینفوگرافی

مزایای استفاده از less اینفوگرافی

دانلود دروس

درس1

درس2

درس3

 

حتما ببینید: آموزش همه زبانهای برنامه نویسی (رایگان)

profile name
میلاد حیدری

بخندید کتاب بخونید و خوب باشید تا جامعه مون به آرامش برسه. لطفا ! هر سوالی دارید در بخش نظرات مطرح کنید. ما یا سایر هموطنان عزیز پاسخ خواهیم داد. برای کمک به سایت ما و گسترش آموزش در بین هموطنان، در سایتها، وبلاگ ها و شبکه های اجتماعی لینک سایت ما را درج کنید.

مطالب پیشنهادی برای شما

محصولات مرتبط

مشاهده همه
آموزش برنامه نویسی سی پلاس پلاس
آموزش برنامه نویسی سی پلاس پلاس
قیمت محصول 230,000 تومان 250,000
ادامه مطلب

کلاس های آنلاین مرتبط

مشاهده همه
سایر مقالات آموزشی
سایر مقالات آموزشی

مدرس : حامد رضوانی

0

*برای مشاهده قیمت کلاس روی رزرو کلاس آنلاین کلیک کنید*

رزرو کلاس آنلاین

دیدگاهتان را بنویسید

1 2 3 4 5

0 نظر درباره «آموزش less از صفر تا صد با 12 درس رایگان»

    هنوز نظری برای این بخش ثبت نشده است
مشاهده همه نظرات
سبد خرید
سبد خرید شما خالی است
× جهت نصب روی دکمه زیر در گوشی کلیک نمائید
آی او اس
سپس در مرحله بعد برروی دکمه "Add To Home Screen" کلیک نمائید