جدول-درس

دستورالعمل‌های مرجع CSS

ویژگی‌های-CSS

درس‌های انتخابی

پیشنهاد دوره:

جعبه ابزار CodeW3C.com

توابع hwb() در CSS

صفحه قبلی توابع hue-rotate() CSS
صفحه بعدی توابع hypot() CSS
برگشت به لایه بالاتر دستورالعمل‌های مرجع Function CSS

تعریف و استفاده

CSS hwb() توابع از مدل رنگ‌های تناژ-سفیدی-سیاهی (HWB) برای مشخص کردن رنگ‌ها استفاده می‌کنند. همچنین می‌توانید یک کانال شفافیت اختیاری (که شفافیت رنگ را نشان می‌دهد) اضافه کنید.

مثال

تعریف رنگ‌های مختلف HWB(A):

#p1 {background-color:hwb(60 40% 20% / 0.5);}
#p2 {background-color:hwb(120 40% 20%);}
#p3 {background-color:hwb(120 40% 20% / 20%);}
#p4 {background-color:hwb(240 40% 20%);}
#p5 {background-color:hwb(240 50% 10%);}
#p6 {background-color:hwb(240 40% 20% / 0.3);}
#p7 {background-color:hwb(300 40% 20% / 0.5);}
#p8 {background-color:hwb(360 40% 20%);}
#p9 {background-color:hwb(360 90% 0%);}

آموزش عملی

نوع دستور زبان CSS

نوع دستور زبان مقیاس‌دهی‌یابhue whiteness blackness / A)

مقدار	توضیح
hue	لازم. مقدار زاویه‌ی چرخه‌ی رنگ را تعریف می‌کند (0 تا 360) - 0 (یا 360) به معنای قرمز، 120 به معنای سبز، 240 به معنای آبی. همچنین می‌توان از none (معادل 0deg) استفاده کرد.
whiteness	لازم. مقدار روشنی ترکیب را تعریف می‌کند؛ 0% به معنای روشنی کامل، 100% به معنای روشنی کامل است. همچنین می‌توان از none (معادل 0%) استفاده کرد.
blackness	لازم. مقدار تاریکی ترکیب را تعریف می‌کند؛ 0% به معنای تاریکی کامل، 100% به معنای تاریکی کامل است. همچنین می‌توان از none (معادل 0%) استفاده کرد.
/ A	اختیاری. مقدار کانال شفافیت رنگ را نشان می‌دهد (0% یا 0 به معنای شفافیت کامل، 100% یا 100 به معنای نیمه‌شفافیت کامل). همچنین می‌توان از none (که معادل 0% است) استفاده کرد. مقدار پیش‌فرض 100% است.

نوع دستور زبان مقیاس‌دهی‌یاب

hwb(from color whiteness blackness / A)

مقدار	توضیح
from color	با کلمه‌ی کلیدی from شروع می‌شود، پس از آن رنگ اصلی نشان‌دهنده‌ی رنگ اصلی است. این رنگ اصلی است که رنگ‌های مطلق بر اساس آن قرار دارند.
hue	لازم. مقدار زاویه‌ی چرخه‌ی رنگ را تعریف می‌کند (0 تا 360) - 0 (یا 360) به معنای قرمز، 120 به معنای سبز، 240 به معنای آبی. همچنین می‌توان از none (معادل 0deg) استفاده کرد.
whiteness	لازم. مقدار روشنی ترکیب را تعریف می‌کند؛ 0% به معنای روشنی کامل، 100% به معنای روشنی کامل است. همچنین می‌توان از none (معادل 0%) استفاده کرد.
blackness	لازم. مقدار تاریکی ترکیب را تعریف می‌کند؛ 0% به معنای تاریکی کامل، 100% به معنای تاریکی کامل است. همچنین می‌توان از none (معادل 0%) استفاده کرد.
/ A	اختیاری. مقدار کانال شفافیت رنگ را نشان می‌دهد (0% یا 0 به معنای شفافیت کامل، 100% یا 100 به معنای نیمه‌شفافیت کامل). همچنین می‌توان از none (که معادل 0% است) استفاده کرد. مقدار پیش‌فرض 100% است.