آموزش HTML صفحه اصلی اینستاگرام ما
رنگ های HTML

رنگ های HTML


رنگ های HTML با نام های رنگ از پیش تعریف شده ، یا با مقادیر RGB ، HEX ، HSL ، RGBA ، یا HSLA مشخص میشوند .


نام های رنگ

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

Tomato
Orange
DodgerBlue
MediumSeaGreen
Gray
SlateBlue
Violet
LightGray

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


رنگ پس زمینه (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 مشخص شوند .

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

rgb(255, 99, 71)
#ff6347
hsl(9, 100%, 64%)

رنگ پس زمینه دو عنصر <div> زیر با مقادیر RGBA و HSLA تنظیم شده است ، که یک کانال آلفا به رنگ اضافه میشود (در اینجا ما 50% شفافیت داریم ) :

rgba(255, 99, 71, 0.5)
hsla(9, 100%, 64%, 0.5)

مثال:

<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>
امتحان کن »



پسین پیشین