آموزش انواع رنگ ها در HTML

رنگ های HTML با استفاده از موارد زیر مشخص می شوند:

1. نام رنگ های از پیش تعیین شده.
2. مقادیر RGB
3. مقادیر HEX
4. مقادیر HSL
5. مقادیر RGBA
6. مقادیر HSLA

استفاده از نام رنگ ها

در HTML، یک رنگ را می توانیم با استفاده از نام آن مشخص کنیم:

HTML از 140 نام رنگ استاندارد پشتیبانی می کند.

رنگ پس زمینه در HTML

ما می توانیم برای عناصر HTML از رنگ پس زمینه(background color) استفاده کنیم:

<h1 style="background-color:DodgerBlue;">سلام به تمام مردم دنیا</h1>
<p style="background-color:Tomato;">این یک پاراگراف است</p> 

رنگ متن در HTML

در HTML می توانیم رنگ یک متن را تنظیم کنیم:

سلام به مردم ایران

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

برنامه‌نویسی شامل عمل‌هایی مثل: تحلیل، ایجاد الگوریتم‌ها، رخ‌نمانگاری دقت الگوریتم‌ها و مصرف منابع، و پیاده‌سازی آن الگوریتم‌ها به یک زبان برنامه‌نویسی انتخاب شده‌است.

<h1 style="color:Tomato;">سلام به تمام مردم ایران</h1>
<p style="color:DodgerBlue;">صبح بخیر</p>
<p style="color:MediumSeaGreen;">احوال شما چطوره</p> 

 رنگ کادر(border) در HTML

در HTML می توانیم رنگ کادرها(border) را تنظیم کنیم:

سلام به مردم ایران

سلام به مردم ایران

سلام به مردم ایران

<h1 style="border: 2px solid Tomato;">سلام به مردم ایران</h1>

<h1 style="border: 2px solid DodgerBlue;">سلام به مردم ایران</h1>

<h1 style="border: 2px solid Violet;">سلام به مردم ایران</h1>

مقادیر رنگ ها در HTML

در HTML می توانیم با استفاده از هریک از موارد زیر، رنگ ها را مشخص کنیم:

1. مقادیر RGB
2. مقادیر HEX
3. مقادیر HSL
4. مقادیر RGBA
5. مقادیر HSLA

 رنگ پس زمینه برای سه عنصر <div> زیر به ترتیب با استفاده از مقادیر RGB و HEX و HSL تنظیم شده است:

در دو عنصر <div> زیر، رنگ پس زمینه(background-color)  با استفاده از مقادیر 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 و HEX و HSL مطالب بیشتری خواهید آموخت.