আপনার ওয়েবসাইটকে সুন্দর চেহারা এবং অনুভূতি দেওয়ার জন্য রং খুবই গুরুত্বপূর্ণ।
হেক্স কোড (হেক্সাডেসিমেল রঙের উপস্থাপনা)
একটি হেক্সাডেসিমেল হল একটি রঙের 6 সংখ্যার উপস্থাপনা। প্রথম দুটি সংখ্যা (RR) একটি লাল মান, পরের দুটি একটি সবুজ মান (GG), এবং শেষটি হল নীল মান (BB)।
Adobe Photoshop এর মত যেকোন গ্রাফিক্স সফটওয়্যার থেকে হেক্সাডেসিমেল মান নেওয়া যেতে পারে। প্রতিটি হেক্সাডেসিমেল কোডের আগে একটি পাউন্ড বা হ্যাশ চিহ্ন # থাকবে। হেক্সাডেসিমেল নোটেশন ব্যবহার করে কয়েকটি রঙের একটি তালিকা নিচে দেওয়া হল। হেক্সাডেসিমেল রঙের কিছু উদাহরণ নিচে দেওয়া হল −
−
রঙের প্রতিনিধিত্ব করার জন্য HTML-এ হেক্স স্টাইল প্রয়োগ করার একটি উদাহরণ দেখা যাকউদাহরণ
<!DOCTYPE html> <html> <head> <style> table, th, td { border: 2px solid black; } </style> </head> <body> <h2>Result</h2> <table> <colgroup> <col span = "3" style = "background-color:#00FF00;"> <col style = "background-color:#00FFFF;"> </colgroup> <tr> <th>Id</th> <th>Name</th> <th>Percentage</th> <th>Rank</th> </tr> <tr> <td>009</td> <td>Tom</td> <td>98</td> <td>1</td> </tr> <tr> <td>011</td> <td>Kieron</td> <td>97</td> <td>2</td> </tr> <tr> <td>039</td> <td>Gayle</td> <td>95</td> <td>3</td> </tr> <tr> <td>017</td> <td>Shaun</td> <td>92</td> <td>4</td> </tr> <tr> <td>009</td> <td>Kane</td> <td>91</td> <td>5</td> </tr> <tr> <td>025</td> <td>Steve</td> <td>87</td> <td>6</td> </tr> <tr> <td>013</td> <td>Jack</td> <td>85</td> <td>7</td> </tr> <tr> <td>023</td> <td>Tim</td> <td>84</td> <td>8</td> </tr> </table> </body> </html>
আউটপুট
RGB রঙের মান
RGB রঙের মান rgb( ) বৈশিষ্ট্য ব্যবহার করে নির্দিষ্ট করা হয়। এই বৈশিষ্ট্যটি তিনটি মান নেয়, প্রতিটি লাল, সবুজ এবং নীলের জন্য একটি। মানটি 0 থেকে 255 বা শতাংশের মধ্যে একটি পূর্ণসংখ্যা হতে পারে।
নিচে RGB −
দিয়ে উপস্থাপিত কিছু রঙ রয়েছে
−
রঙের প্রতিনিধিত্ব করতে HTML-এ RGB শৈলী বাস্তবায়নের একটি উদাহরণ দেখা যাকউদাহরণ
<!DOCTYPE html> <html> <head> <style> table, th, td { border: 2px solid black; } </style> </head> <body> <h2>Result</h2> <table> <colgroup> <col span = "3" style = "background-color:rgb(255,0,0);"> <col style = "background-color:rgb(255,255,0);"> </colgroup> <tr> <th>Id</th> <th>Name</th> <th>Percentage</th> <th>Rank</th> </tr> <tr> <td>009</td> <td>Tom</td> <td>98</td> <td>1</td> </tr> <tr> <td>011</td> <td>Kieron</td> <td>97</td> <td>2</td> </tr> <tr> <td>039</td> <td>Gayle</td> <td>95</td> <td>3</td> </tr> <tr> <td>017</td> <td>Shaun</td> <td>92</td> <td>4</td> </tr> <tr> <td>009</td> <td>Kane</td> <td>91</td> <td>5</td> </tr> <tr> <td>025</td> <td>Steve</td> <td>87</td> <td>6</td> </tr> <tr> <td>013</td> <td>Jack</td> <td>85</td> <td>7</td> </tr> <tr> <td>023</td> <td>Tim</td> <td>84</td> <td>8</td> </tr> </table> </body> </html>
আউটপুট
HSL রঙের মান
HTML এর সাথে, আপনি HUEও সেট করতে পারেন, যেমন 'H' মানে হিউ, 'S' হল স্যাচুরেশন এবং 'L' হল হালকাতার জন্য৷
−
রঙের প্রতিনিধিত্ব করার জন্য এইচটিএমএল-এ HSL শৈলী বাস্তবায়নের একটি উদাহরণ দেখা যাকউদাহরণ
<!DOCTYPE html> <html> <head> <style> table, th, td { border: 2px solid black; } </style> </head> <body> <h2>Result</h2> <table> <colgroup> <col span = "3" style = "background-color: hsl(300, 75%, 85%); "> <col style = "background-color: hsl(200, 30%, 40%);"> </colgroup> <tr> <th>Id</th> <th>Name</th> <th>Percentage</th> <th>Rank</th> </tr> <tr> <td>009</td> <td>Tom</td> <td>98</td> <td>1</td> </tr> <tr> <td>011</td> <td>Kieron</td> <td>97</td> <td>2</td> </tr> <tr> <td>039</td> <td>Gayle</td> <td>95</td> <td>3</td> </tr> <tr> <td>017</td> <td>Shaun</td> <td>92</td> <td>4</td> </tr> <tr> <td>009</td> <td>Kane</td> <td>91</td> <td>5</td> </tr> <tr> <td>025</td> <td>Steve</td> <td>87</td> <td>6</td> </tr> <tr> <td>013</td> <td>Jack</td> <td>85</td> <td>7</td> </tr> <tr> <td>023</td> <td>Tim</td> <td>84</td> <td>8</td> </tr> </table> </body> </html>
এটি নিম্নলিখিত আউটপুট −
তৈরি করবে