رنگها HTML
در این درس:
رنگ های HTML با استفاده از نام یا مقادیر رنگ از پیش تعریف شده مشخص می شوند RGB ، HEX ، HSL ، RGBA ، HSLA.
نام رنگها
در HTML می توان یک رنگ را با استفاده از نام رنگ مشخص کرد:
140 نام استاندارد رنگ در HTML پشتیبانی می شود.
Background Color - رنگ پس زمینه
می توانید رنگ پس زمینه را برای المان HTML تنظیم کنید:
لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است.
مثال
<h1 style="background-color:DodgerBlue;">سلام دنیا</h1>
<p
style="background-color:Tomato;"> ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و ...
</p>
خودتان آزمایش کنید »
Text Color - رنگ متن
می توانید رنگ متن را تنظیم کنید:
سلام دنیا
لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و
تا از نظر گرافیکی نشانگر چگونگی نوع و اندازه فونت و ظاهر متن باشد.
مثال
<h1 style="color:Tomato;">سلام دنیا</h1>
<p
style="color:DodgerBlue;">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با
استفاده
از طراحان
گرافیک است. چاپگرها و</p>
<p style="color:MediumSeaGreen;">تا از نظر گرافیکی
نشانگر چگونگی نوع و اندازه فونت و ظاهر متن باشد.</p>
خودتان
آزمایش کنید »
Border Color - رنگ حاشیه
می توانید رنگ حاشیه را تنظیم کنید:
سلام دنیا
سلام دنیا
سلام دنیا
مثال
<h1 style="border:2px
solid Tomato;">سلام دنیا</h1>
<h1 style="border:2px
solid DodgerBlue;">سلام دنیا</h1>
<h1 style="border:2px
solid Violet;">سلام دنیا</h1>
خودتان آزمایش کنید »
مقادیر رنگ
در HTML ، رنگها همچنین می توانند با استفاده از مقادیر RGB ، HEX ، HSL ، RGBA و HSLA مشخص شوند:
همان نام رنگ "قرمز گوجه ای" هستند تمامی این مقادیر :
همان نام رنگ " قرمز گوجه ای" ، اما 50٪ شفاف تر:
مثال
<h1 style="background-color:rgb(255,
99, 71);">...</h1>
<h1
style="background-color:#ff6347;">...</h1>
<h1
style="background-color:hsl(9,
100%, 64%);">...</h1>
<h1 style="background-color:rgba(255,
99, 71, 0.5);">...</h1>
<h1 style="background-color:hsla(9,
100%, 64%, 0.5);">...</h1>
Попробуйте сами »
مقدار RGB
در HTML ، یک رنگ را می توان با استفاده از این فرمول به عنوان مقدار RGB تعیین کرد:
rgb( R قرمز, G سبز, B آبی)
هر پارامتر (قرمز ، سبز و آبی) شدت رنگ را از 0 تا 255 تعریف می کند.
به عنوان مثال rgb (255 ، 0 ، 0) به عنوان قرمز نمایش داده می شود زیرا قرمز در بالاترین مقدار تنظیم شده است ارزش (255) و بقیه روی 0 تنظیم شده اند.
برای نمایش سیاه ، همه گزینه های رنگ را روی 0 تنظیم کنید ، مانند اینجا: rgb (0 ، 0 ، 0).
برای نمایش سفید ، همه گزینه های رنگ را روی 255 تنظیم کنید ، مانند اینجا: rgb (255 ، 255 ، 255).
با مخلوط کردن مقادیر RGB در زیر آزمایش کنید:
RED قرمز
GREEN سبز
BLUE آبی
مثال
خودتان آزمایش کنید »
مقیاس خاکستری اغلب با استفاده از مقادیر برابر برای هر سه منبع نور تعریف می شود:
مثال
خودتان آزمایش کنید »
مقدار HEX
در HTML ، یک رنگ را می توان با استفاده از مقدار هگزادسیمال در فرم تعیین کرد:
rrggbb#
جایی که rr (red), و gg (green) و bb (blue) مقادیر هگزادسیمال 00 تا ff (همان اعشاری 0-255). هستند
برای مثال، #ff0000 قرمز نشان داده می شود زیرا قرمز روی بالاترین مقدار (ff) و بقیه در کمترین مقدار (00) تنظیم می شوند.
مثال دیگر ، #00ff00 به عنوان سبز نمایش داده می شود ، زیرا رنگ سبز در بالاترین مقدار (ff) قرار گرفته و دو مورد دیگر (قرمز و آبی) روی 00 تنظیم شده اند.
برای نمایش سیاه ، همه پارامترهای رنگ را روی 00 تنظیم کنید ، مانند این: # 000000. برای نمایش سفید ، تمام پارامترهای رنگ را روی ff تنظیم کنید ، مانند این: #ffffff.
مقیاس خاکستری اغلب با استفاده از مقادیر برابر برای هر سه رنگ تعریف می شود:
مقدار HSL
در HTML می توان با استفاده از رنگ ، اشباع و سبک بودن یک رنگ را مشخص کرد - HSL در فرم:
hsl(hue, saturation, lightness)
Hue درجه ای از چرخ رنگ از 0 تا 360 است. 0 قرمز ، 120 سبز و 240 آبی است.
(saturation) اشباع یک مقدار درصد است ، 0٪ به معنای سایه خاکستری و 100٪ تمام رنگ است.
سبکی (lightness) نیز یک مقدار درصد است ، 0٪ سیاه و 100٪ سفید است.
مثال
خودتان آزمایش کنید »
اشباع
اشباع را می توان به عنوان شدت یک رنگ توصیف کرد.
100٪ رنگ خالص و بدون سایه خاکستری است
50٪ 50٪ خاکستری است ، اما هنوز هم رنگ را می بینید.
0٪ کاملاً خاکستری است ، دیگر نمی توانید رنگ آن را ببینید.
مثال
خودتان آزمایش کنید »
سبکی
سبک بودن یک رنگ را می توان اینگونه توصیف کرد که شما می خواهید به چه مقدار نور رنگ بدهید ، جایی که 0٪ به معنای عدم نور (سیاه) ، 50٪ به معنای 50٪ نور (نه تاریک و نه روشن) 100٪ به معنای روشنایی کامل (سفید) است.
مثال
خودتان آزمایش کنید »
سایه های خاکستری
مقیاس خاکستری اغلب با تنظیم رنگ و اشباع روی 0 و تنظیم روشنایی از 0٪ تعیین می شود تا 100 to برای به دست آوردن سایه های تیره / روشن:
مثال
خودتان آزمایش کنید »
مقادیر رنگی HSLA
مقادیر رنگ HSLA پسوند مقادیر رنگ HSL با یک کانال آلفا است - که میزان کدری برای یک رنگ را مشخص می کند.
مقدار رنگ HSLA با:
rgba(red, green, blue, alpha)
پارامتر آلفا عددی بین 0.0 (کاملاً شفاف) و 1.0 است (به هیچ وجه شفاف نیست):
مثال
خودتان آزمایش کنید »
سایت توسط چارچوب farsiw3.ir طراحی شده است.
