رنگ - tirotir

رنگ‌های شش‌گانه (Hexadecimal Colors)

مقادیر رنگ‌های شش‌گانه با تمام مرورگرها سازگاری دارند.

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

rrggbb

که در آن rr (قرمز)، gg (سبز) و bb (آبی) عدد صحیح شش‌گانه در بازه 00 تا ff هستند که شدت رنگ را مشخص می‌کنند.

به عنوان مثال، ff0000 به عنوان قرمز نمایش داده می‌شود، زیرا قرمز به بالاترین مقدار خود (ff) تنظیم شده است و دو مقدار دیگر (سبز و آبی) به 00 تنظیم شده‌اند.

یک مثال دیگر، 00ff00 به عنوان سبز نمایش داده می‌شود، زیرا سبز به بالاترین مقدار خود (ff) تنظیم شده است و دو مقدار دیگر (قرمز و آبی) به 00 تنظیم شده‌اند.

برای نمایش رنگ سیاه، تمام پارامترهای رنگ را به 00 تنظیم کنید، مانند این: 000000.

برای نمایش رنگ سفید، تمام پارامترهای رنگ را به ff تنظیم کنید، مانند این: ffffff.

<!DOCTYPE html>
<html align="left">
<style>
div {
    background-color: #00bfff;
    color: #ffffff;
    padding: 20px;
}
</style>
<body>

<div>

<h1>Andisheh Pardazan Anzan</h1>
<p>Welcome to tirotir.ir.</p>

</div> 
</body>
</html>

رنگ‌های RGB

مقادیر رنگ RGB با تمام مرورگرها سازگاری دارند.

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

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

هر پارامتر (قرمز، سبز، و آبی) شدت رنگ را با یک مقدار بین 0 تا 255 مشخص می‌کند.

به عنوان مثال، rgb(255, 0, 0) به عنوان قرمز نمایش داده می‌شود، زیرا قرمز به بالاترین مقدار خود (255) تنظیم شده است و دو مقدار دیگر (سبز و آبی) به 0 تنظیم شده‌اند.

یک مثال دیگر، rgb(0, 255, 0) به عنوان سبز نمایش داده می‌شود، زیرا سبز به بالاترین مقدار خود (255) تنظیم شده است و دو مقدار دیگر (قرمز و آبی) به 0 تنظیم شده‌اند.

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

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

<!DOCTYPE html>
<html>
<style>
div {
    background-color: rgb(0, 191, 255);
    color: rgb(255, 255, 255);
    padding: 20px;
}
</style>
<body>

<div>

<h1>Andisheh Pardazan Anzan</h1>
<p>Welcome to tirotir.ir.</p>

</div> 
</body>
</html>

رنگ‌های HSL

مقادیر رنگ HSL در مرورگرهای Edge، Chrome، Firefox، Safari، Opera نسخه 10 به بالا و در IE نسخه 9 به بالا پشتیبانی می‌شوند.

HSL مخفف عبارت Hue (رنگ)، Saturation (اشباع) و Lightness (روشنایی) است.

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

hsl(رنگ، اشباع، روشنایی)

رنگ (Hue)

رنگ به میزان درجه‌ای از مدار رنگی از 0 تا 360 تعریف می‌شود. 0 (یا 360) قرمز، 120 سبز، و 240 آبی است.

اشباع (Saturation)

اشباع می‌تواند به عنوان شدت رنگ توصیف شود. این یک مقدار درصدی از 0% تا 100% است.

100% به معنای رنگ کامل و بدون سایه‌های خاکستری است.

50% به معنای 50% خاکستری است، اما هنوز می‌توان رنگ را دید.

0% به معنای کاملاً خاکستری است؛ شما دیگر رنگ را نمی‌بینید.

روشنایی (Lightness)

روشنایی یک رنگ را می‌توان به عنوان میزان نوری که می‌خواهید به رنگ بدهید، توصیف کرد، که در آن 0% به معنای عدم نور (تاریک)، 50% به معنای نور 50% (نه تاریک و نه روشن) و 100% به معنای نور کامل است.

<!DOCTYPE html>
<html>
<style>
div {
    background-color: hsl(170, 50%, 50%);
    color: hsl(0, 50%, 50%);
    padding: 20px;
}
</style>
<body>

<div>

<h1>Andisheh Pardazan Anzan</h1>
<p>Welcome to tirotir.ir.</p>

</div> 
</body>
</html>

انتخاب رنگ

<!DOCTYPE html>
<html>
<head>
<style>
  h1 {
    color: #333;
    font-family: Arial, sans-serif;
    font-size: 36px; /* font size */
    text-align: center; 
    background-color: #f0f0f0; 
    padding: 20px; 
    border-radius: 10px; 
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); 
  }
  h2 {
    color: #666;
  }
  a {
    text-decoration: none;
    color: #0077b6;
  }
  button {
    background-color: #0077b6;
    color: #fff;
    padding: 10px 20px;
    border: none;
    cursor: pointer;
  }

  #demo {
    font-size: 18px;
    margin-top: 20px;
  }
</style>
</head>
<body>
<h1>Andishe Pardazan Anzan</h1>
<h2>Access an a Element</h2>
<a id="xyz" href="https://www.tirotir.ir">APA</a>
<p>Click "Try it" to get the URL of the link.</p>
<button onclick="myFunction()">Run</button>
<p id="demo"></p>
<script>
function myFunction() {
  const element = document.getElementById("xyz").href;
  document.getElementById("demo").innerHTML = element;
}
</script>
</body>
</html>