مقدارهای رنگ قانونی CSS
- پچھلے پیج سی ایس ایس رنگ
- آئندہ پیج سی ایس ایس کی دفعہ
سی ایس ایس رنگ
رنگها در CSS میتوانند به روشهای زیر مشخص شوند:
- رنگهای هگزادسیمال
- رنگهای هگزادسیمال با شفافیت
- رنگ RGB
- رنگ RGBA
- رنگ HSL
- HSLA رنگ
- پیش تعین کا/پر مشترک کا رنگ کا نام
- استفاده از
currentcolorکلمات کلیدی
رنگهای هگزادسیمال
با استفاده از #RRGGBB رنگهای هگزادسیمال مشخص کنید، که RR (قرمز)، GG (سبز) و BB (بنفش) اعداد صحیح هگزادسیمال مقادیر رنگها (مقادیر) را مشخص میکنند. تمام مقادیر باید بین 00 تا FF باشند.
مثال، ارزش #0000ff به بنفش تبدیل میشود، زیرا مقدار رنگ بنفش تنظیم شده به بالاترین مقدار (ff) و مقدارهای دیگر تنظیم شده به 00.
مثال
رنگهای HEX مختلف تعریف کنید:
#p1 {background-color: #ff0000;} /* قرمز */
#p2 {background-color: #00ff00;} /* سبز */
#p3 {background-color: #0000ff;} /* بنفش */
رنگهای هگزادسیمال با شفافیت
با استفاده از #RRGGBB رنگهای هگزادسیمال مشخص کنید. برای افزایش شفافیت، دو عدد اضافی بین 00 و FF اضافه کنید.
مثال
رنگ HEX با شفافیت تعریف کنید:
#p1a {background-color: #ff000080;} /* قرمز با شفافیت */
#p2a {background-color: #00ff0080;} /* سبز با شفافیت */
#p3a {background-color: #0000ff80;} /* بنفش با شفافیت */
رنگ RGB
مقدار رنگ RGB توسط توابع rgb()تعریف، نحوه استفاده از آن به صورت زیر است:
rgb(red, سبز, blue)
هر پارامتر (red, سبز, blueقوت رنگ را تعریف میکند، میتواند عدد صحیح بین 0 تا 255 یا درصدی بین 0٪ تا 100٪ باشد.
مثال، کالای rgb(0,0,255) بنفش نمودار، زیرا پارامتر blue تنظیم شده به بالاترین مقدار (255)، و پارامترهای دیگر تنظیم شده به 0.
علاوه بر این، موارد زیر رنگهای مشابه را تعریف میکنند: rgb(0,0,255) و rgb(0%,0%,100%)。
مثال
تعریف رنگهای مختلف RGB:
#p1 {background-color: rgb(255, 0, 0);} /* قرمز */
#p2 {background-color: rgb(0, 255, 0);} /* سبز */
#p3 {background-color: rgb(0, 0, 255);} /* آبی */
رنگ RGBA
رنگ RGBA یک توسعه از رنگ RGB است که کانال آلفا (شفافیت) دارد - که شفافیت شیء را مشخص میکند.
رنگ RGBA از طریق توابع rgba()تعریف، نحوه استفاده از آن به صورت زیر است:
rgba(red, سبز, blue, alpha)
alpha پارامتر 0.0 (کاملاً شفاف) اور 1.0 (کاملاً نیم شفاف) کے درمیان کا نمبر ہوتا ہے.
مثال
تعریف رنگهای مختلف RGB با شفافیت:
#p1 {background-color: rgba(255, 0, 0, 0.3);} /* قرمز با شفافیت */
#p2 {background-color: rgba(0, 255, 0, 0.3);} /* سبز با شفافیت */
#p3 {background-color: rgba(0, 0, 255, 0.3);} /* آبی با شفافیت */
رنگ HSL
HSL به معنای زنگ (hue)، اشارهدهی (saturation) و روشنایی (lightness) است - که نمایش نمودار عمودی رنگ است.
استفاده از توابع hsl()تعریف مقدار رنگ HSL، نحوه استفاده از این تابع به صورت زیر است:
hsl(hue, saturation, lightness)
زنگ یک درجه در حلقه رنگ (از 0 تا 360) است - 0 (یا 360) قرمز، 120 سبز و 240 آبی است.
اشارهدهی یک درصدی نیز وجود دارد؛ 0٪ تیرگی و 100٪ رنگ کامل است.
اشارهدهی یک درصدی نیز وجود دارد؛ 0٪ سیاه و 100٪ سفید است.
مثال
تعریف رنگهای مختلف HSL:
#p1 {background-color: hsl(120, 100%, 50%);} /* سبز */
#p2 {background-color: hsl(120, 100%, 75%);} /* سبز روشن */
#p3 {background-color: hsl(120, 100%, 25%);} /* تیرگی سبز */
#p4 {background-color: hsl(120, 60%, 70%);} /* 柔和的绿色 */
HSLA رنگ
HSLA رنگ
HSLA رنگ کا نمبر HSL رنگ کا نمبر کا توسیع ہے، جس میں Alpha چینل شامل ہوتا ہے - معاملات کی نیم شفافیت کا تعین کرتا ہے. hsla() فونکشنتعین کریں، اس فونکشن کا جملہ بنائیں:
hsla(hue, saturation, lightness, alpha)
alpha پارامتر 0.0 (کاملاً شفاف) اور 1.0 (کاملاً نیم شفاف) کے درمیان کا نمبر ہوتا ہے.
مثال
نرم کا مختلف HSL رنگ کا تعریف کریں:
#p1 {background-color: hsla(120, 100%, 50%, 0.3);} /* نرم کا کا رنگ نما نہ کی پتھر */
#p2 {background-color: hsla(120, 100%, 75%, 0.3);} /* نرم کا کا رنگ نما نہ کی پتھر */
#p3 {background-color: hsla(120, 100%, 25%, 0.3);} /* نرم کا کا رنگ نما نہ کی پتھر */
#p4 {background-color: hsla(120, 60%, 70%, 0.3);} /* نرم سوداوی رنگ کا رنگ نما نہ کی پتھر */
پیش تعین کا/پر مشترک کا رنگ کا نام
HTML اور CSS رنگ معیارات میں 140 کا رنگ کا نام پیش نکالا گیا ہے.
مثال کے طور پر:blue،red،coral،brown جیسا کہ:
مثال
مختلف رنگ کا نام تعریف کریں:
#p1 {background-color: blue;}
#p2 {background-color: red;}
#p3 {background-color: coral;}
#p4 {background-color: brown;}
تمام کا نام کا فہرست ہمارے رنگ نام کا مراجع کتاب میں پایا جاسکتا ہے.
currentcolor کا کلمات
currentcolor متن کا کی وسیعت کی پراگرام کا کلمات کا مرجع.
مثال
کمپنی <div> کا پرانتز رنگ سوداوی کا هوا کی وسیعت کی، چون <div> کا متن رنگ سوداوی کا هوا کی وسیعت کی:
#myDIV {
color: blue; /* رنگ لبلو */
border: 10px solid currentcolor; /* سوداوی رنگی پرانتز */
}
- پچھلے پیج سی ایس ایس رنگ
- آئندہ پیج سی ایس ایس کی دفعہ
