۱۴
اسفند

جلسه ۳۱ : تابع کانال های رنگی در LESS

دسته‌بندی‌ها :

جزئیات
نوع محتواآموزش تصویری

فهرست

مقدمه

با عرض سلام خدمت کاربران سایت پی وی لرن ، و کاربرانی که دوره کامل آموزش LESS را دنبال می کنند. در این فصل، ما به معرفی تابع دیگری از توابع پیش فرض در LESS یعنی تابع کانال های رنگی در LESS می پردازیم.LESS از چندین توابع برای تنظیم متغییر با کانال رنگی خاص پشتیبانی میکند .

تابع کانال های رنگی در LESS

همانطور که گفته شد LESS از چندین توابع برای تنظیم متغییر با کانال رنگی خاص پشتیبانی میکند و بسته به تعریف رنگ کانال متغیر را تعیین می کند. رنگ HSL دارای hue, saturation و lightness است و رنگ RGB دارای کانال قرمز، سبز و آبی است. جدول زیر لیست تمام تابع کانال های رنگی در LESS را نشان می دهد:

مثال

تابع و توضیحات

شماره

مثال :

background: hue(hsl(75, 90%, 30%));

1	background: hue(hsl(75, 90%, 30%));

خروجی کامپایل شده در css:

مثال :

background: 75;

1	background: 75;

hue:

در فضای رنگ HSL، کانال hue از شیء رنگ استخراج می شود.

مثال :

background: saturation(hsl(75, 90%, 30%));

1	background: saturation(hsl(75, 90%, 30%));

خروجی کامپایل شده در css:

مثال :

background: 90%;

1	background: 90%;

saturation:

در فضای رنگ HSL، کانال saturation از شیء رنگ استخراج می شود.

مثال :

background: lightness(hsl(75, 90%, 30%));

1	background: lightness(hsl(75, 90%, 30%));

خروجی کامپایل شده در css:

مثال :

background: 30%;

1	background: 30%;

lightness:

در فضای رنگ HSL، کانال lightness از شیء رنگ استخراج می شود.

مثال :

background: hsvhue(hsv(75, 90%, 30%));

1	background: hsvhue(hsv(75, 90%, 30%));

خروجی کامپایل شده در css:

مثال :

background: 75;

1	background: 75;

hsvhue:

در فضای رنگ HSV، کانال hue از شیء رنگ استخراج می شود.

مثال :

background: hsvsaturation(hsv(75, 90%, 30%));

1	background: hsvsaturation(hsv(75, 90%, 30%));

خروجی کامپایل شده در css:

مثال :

background: 90%;

1	background: 90%;

hsvsaturation:

در فضای رنگ HSV، کانال saturation از شیء رنگ استخراج می شود.

مثال :

background: hsvvalue(hsv(75, 90%, 30%));

1	background: hsvvalue(hsv(75, 90%, 30%));

خروجی کامپایل شده در css:

مثال :

background: 30%;

1	background: 30%;

hsvvalue:

در فضای رنگ HSV، کانال value از شیء رنگ استخراج می شود.

مثال :

background: red(rgb(5, 15, 25));

1	background: red(rgb(5, 15, 25));

خروجی کامپایل شده در css:

مثال :

background: 5;

1	background: 5;

red:

کانال رنگ قرمز از شیء رنگ استخراج می شود.

مثال :

background: green(rgb(5, 15, 25));

1	background: green(rgb(5, 15, 25));

خروجی کامپایل شده در css:

مثال :

background: 15;

1	background: 15;

green:

کانال رنگ سبز از شیء رنگ استخراج می شود.

مثال :

background: blue(rgb(5, 15, 25));

1	background: blue(rgb(5, 15, 25));

خروجی کامپایل شده در css:

مثال :

background: 25;

1	background: 25;

blue:

کانال رنگ آبی از شیء رنگ استخراج می شود.

مثال :

background: alpha(rgba(5, 15, 25, 1.5));

1	background: alpha(rgba(5, 15, 25, 1.5));

خروجی کامپایل شده در css:

مثال :

background: 2;

1	background: 2;

alpha:

کانال رنگ alpha از شیء رنگ استخراج می شود.

۱۰

مثال :

background: luma(rgb(50, 250, 150));

1	background: luma(rgb(50, 250, 150));

خروجی کامپایل شده در css:

مثال :

background: 71.2513323%;

1	background: 71.2513323%;

luma:

مقدار luma محاسبه شده از شیء رنگ.

۱۱

مثال :

 	
background: luminance(rgb(50, 250, 150));

1 2	background: luminance(rgb(50, 250, 150));

خروجی کامپایل شده در css:

مثال :

background: 78.53333333%;

1	background: 78.53333333%;

luminance:

مقدار Luma بدون گاما محاسبه می شود.

۱۲

کلام آخر

آموزش تابع کانال های رنگی در LESS به پایان رسید.توابع متفرقه،توابع لیست،توابع رشته در LESS،توابع ریاضی،توابع نوع و تشخیص رنگ و تعریف رنگ و توابع کانال رنگی و توابع عملیات رنگ و… از جمله توابع مورد استفاده در LESS می باشند که ما هر یک را به طور کامل معرفی می کنیم.جلسه بعد توابع عملیات رنگ آموزش داده خواهد شد.

QR: جلسه ۳۱ : تابع کانال های رنگی در LESS

به اشتراک بگذارید

Color Channel Functions ,تنظیم متغییر با کانال رنگی ,کانال های رنگی در LESS

دیدگاه کاربران

تعداد دیدگاه : 0

پی وی لرن – آموزش برنامه نویسی و طراحی وب سایت

دوره های آموزشی آکادمی پی وی لرن (پروژه محور و ویژه بازار کار)

جلسه ۳۱ : تابع کانال های رنگی در LESS

مقدمه

تابع کانال های رنگی در LESS

مثال

تابع و توضیحات

شماره

کلام آخر

لیست مطالب دوره

مقدمه

ویژگی های زبان برنامه نویسی LESS

توابع در LESS

کاربرد LESS

مطالب ویژه

دسته های اصلی

برگه ها

بلاگ