رنگ های HTML

رنگ های HTML  چه کدهایی دارند؟

آموزش html  درس دوازدهم

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

رنگ های HTML
رنگ های HTML

نام رنگ های HTML

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

 

Tomato

Orange

DodgerBlue

MediumSeaGreen

Gray

SlateBlue

Violet

LightGray

رنگ پس زمینه

شما می توانید رنگ پس زمینه برای عناصر HTML را تنظیم کنید:

 

یادگیری طراحی وب

در عصر دیجیتال شاید چیزی که بیش از پیش حائزاهمیت است . یادگیری علوم مرتبط با فناوری باشد. پس قبل از اینکه این موضوع همه گیر شود به یادگیری این فنون بپردازید و سود ببرید. و کسب و کار خود را دیجیتالی کنید .

مثال :

 
<h1 style="background-color:DodgerBlue;">Hello World</h1>



Lorem ipsum...

 

رنگ متن

شما می توانید رنگ متن را تنظیم کنید

.

لزوم یادگیری طراحی وب

با یادگیری طراحی وب می توانید خدمات خود را به صورت دیجیتالی به مردم معرفی کنید و همچنین سود بیشتری ببرید در بسته آنلاین کسب و کار اینترنتی تمامی اصول به شما یاد داده می شود

پس با ما همراه باشید تا در دنیای دیجیتال حرفی برای گفتن داشته باشید

حتما بخوانید:  طراحی ظاهر html با css

مثال :

<h1 style=”color:Tomato”>لزوم یادگیری طراحی وب</h1>
<p style=”color:DodgerBlue”>با یادگیری طراحی وب می توانید خدمات خود را به صورت دیجیتالی به مردم معرفی کنید و همچنین سود بیشتری ببرید در بسته آنلاین کسب و کار اینترنتی تمامی اصول به شما یاد داده می شود </p>
<p style=”color:MediumSeaGreen”>پس با ما همراه باشید تا در دنیای دیجیتال حرفی برای گفتن داشته باشید </p>

رنگ حاشیه در html

شما می توانید رنگ حاشیه را نیز تنظیم کنید:

 

Hello World

Hello World

Hello World

مثال :

<h1 style=”border:2px solid Tomato”>Hello World</h1>
<h1 style=”border:2px solid DodgerBlue”>Hello World</h1>
<h1 style=”border:2px solid Violet”>Hello World</h1>

مقادیر  رنگ در html

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

همانند نام رنگ “Tomato” :

rgb(255, 99, 71)

#ff6347

hsl(9, 100%, 64%)

همانند رنگ “Tomato”  اما ۵۰ درصد شفاف تر :

 

rgba(255, 99, 71, 0.5)

hsla(9, 100%, 64%, 0.5)

 

مثال :
<h1 style=”background-color: #ff6347; text-align: center;”>rgb(255, 99, 71)</h1>
<h1 style=”background-color: #ff6347; text-align: center;”>#ff6347</h1>
<h1 style=”background-color: hsl(9, 100%, 64%); text-align: center;”>hsl(9, 100%, 64%)</h1>

حتما بخوانید:  پاراگراف های html

<h1 style=”background-color: rgba(255, 99, 71, 0.5); text-align: center;”>rgba(255, 99, 71, 0.5)</h1>
<h1 style=”background-color: rgba(255, 99, 71, 0.5); text-align: center;”>hsla(9, 100%, 64%, 0.5)</h1>

مقادیر  RGB

در HTML، یک رنگ را می توان به عنوان یک مقدار RGB تعریف کرد، با استفاده از این فرمول:

rgb (قرمز، سبز، آبی)

هر پارامتر (قرمز، سبز و آبی) شدت رنگ را بین ۰ تا ۲۵۵ تعریف می کند.

به عنوان مثال، rgb (255، ۰، ۰) به صورت قرمز نمایش داده می شود، چرا که قرمز به بالاترین مقدار آن (۲۵۵) و دیگران به ۰ تنظیم شده است.

برای نمایش رنگ سیاه، تمام پارامترهای رنگ باید به ۰ تنظیم شوند، مانند این: rgb (0، ۰، ۰).

برای نمایش رنگ سفید، تمام پارامترهای رنگ باید به ۲۵۵ تنظیم شود، مانند این: rgb (255، ۲۵۵، ۲۵۵).

آموزش html  درس سیزدهم

 

امتیاز کاربران به این مطلب
۲ نفر - میانگین: ۵
تلگرام

دیدگاه‌تان را ثبت کنید:

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

6 + 16 =

PHN0eWxlPi5oX2lmcmFtZS1hcGFyYXRfZW1iZWRfZnJhbWV7cG9zaXRpb246cmVsYXRpdmU7fSAuaF9pZnJhbWUtYXBhcmF0X2VtYmVkX2ZyYW1lIC5yYXRpbyB7ZGlzcGxheTpibG9jazt3aWR0aDoxMDAlO2hlaWdodDphdXRvO30gLmhfaWZyYW1lLWFwYXJhdF9lbWJlZF9mcmFtZSBpZnJhbWUge3Bvc2l0aW9uOmFic29sdXRlO3RvcDowO2xlZnQ6MDt3aWR0aDoxMDAlOyBoZWlnaHQ6MTAwJTt9PC9zdHlsZT48ZGl2IGNsYXNzPSJoX2lmcmFtZS1hcGFyYXRfZW1iZWRfZnJhbWUiPiA8c3BhbiBzdHlsZT0iZGlzcGxheTogYmxvY2s7cGFkZGluZy10b3A6IDU3JSI+PC9zcGFuPjxpZnJhbWUgc3JjPSJodHRwczovL3d3dy5hcGFyYXQuY29tL3ZpZGVvL3ZpZGVvL2VtYmVkL3ZpZGVvaGFzaC85dHk0VS92dC9mcmFtZSIgYWxsb3dGdWxsU2NyZWVuPSJ0cnVlIiB3ZWJraXRhbGxvd2Z1bGxzY3JlZW49InRydWUiIG1vemFsbG93ZnVsbHNjcmVlbj0idHJ1ZSIgPjwvaWZyYW1lPjwvZGl2Pg==
با سپاس از ثبت دیدگاه شما دوست عزیز
از تماشای این ویدیو لذت ببرید ...
فقط چند ثانیه تا دانلود فاصله دارید!
* دانلود فایل سخنرانی استیو جابز ...
ایبوک هدف‌گذاری موثر
زودتر از آنچه فکرش را می‌کنید به خواسته‌هایتان دست پیدا کنید!
* لینک دانلود بلافاصله ایمیل می‌شود.
چهار عامل شگفت انگیز کسب درآمد چیست؟
فقط چند ثانیه تا دانلود فاصله دارید!
* سه ایده کسب و کار خانگی پولساز
فقط چند ثانیه تا دانلود فاصله دارید!
* ایبوک: ده مکان عالی برای پیدا کردن یک ایده جدید
فقط چند ثانیه تا دانلود فاصله دارید!
* دانلود ویدیوی جذاب و با کیفیت مصاحبه جک ما
از همین امروز شروع کنید
بدون تجربه و دانش فنی وارد دنیای درآمدهای اینترنتی شوید!
فایل‌های آموزشی برای شما ایمیل می‌شود.
فقط چند ثانیه تا دریافت این فایل آموزشی فاصله دارید!
فایل‌های آموزشی ویژه اعضای سایت
* اگر عضو نیستید با وارد کردن ایمیل‌تان به این فایل دسترسی پیدا می‌کنید
دسترسی مخصوص اعضای سایت
عضو سایت نیستید؟
فقط کافیه نام و ایمیل‌تان را وارد کنید و ...
* دسترسی سریع به تمام فایل‌های آموزشی
هدیه ما به شما
با سپاس از اینکه دیدگاه تان را در سایت ما ثبت کردید.


یک کوپن تخفیف 30%
  • مشاوره حضوری
  • دوره های آنلاین
  • بسته های آموزشی
  • محصولات دانلودی
  • وبینارهای آموزشی
  این کد فقط یکبار به شما نمایش داده می‌شود.
کد: qwert
ورود کاربران
* دسترسی رایگان به بخش آکادمی