কম্পিউটার টিউটোরিয়াল

HTML ব্যাকগ্রাউন্ড কালার

CSS অভিজ্ঞ ডেভেলপারদের জন্যও ভয়ঙ্কর হতে পারে—এতটেক্সট অপশন! কিন্তু এই আর্টিকেলে, আমরা আলোচনা করব কীভাবে একটি আলাদা ক্যাসকেডিং স্টাইল শিট তৈরি না করেই আপনার HTML ডকুমেন্টে ব্যাকগ্রাউন্ড কালার চেঞ্জ করবেন।

HTML5 ব্যবহার করার সময়, আপনি style অ্যাট্রিবিউট এবং প্রোপার্টি `background-color` ব্যবহার করে ব্যাকগ্রাউন্ড কালার যোগ করতে পারেন। আপনি আপনার পছন্দের এলিমেন্টে এই অ্যাট্রিবিউট ইমপ্লিমেন্ট করতে পারেন; যাইহোক, পুরো পেজের ব্যাকগ্রাউন্ড কালার সেট করতে হলে, style অ্যাট্রিবিউট body ট্যাগে থাকা উচিত। আপনার HTML কিছু এইভাবে দেখতে পারে:

<!DOCTYPE html> <html> <head> </head> <body style="background-color:orange;"> <h1>This is our header.</h1> <p>This is our text.</p> </body> </html> 

এই কোড আমাদের একটি নারাঞ্জি ব্যাকগ্রাউন্ড সম্বলিত HTML পেজ দেয়।

অতিরিক্ত ওয়েব কালার সিস্টেম ইমপ্লিমেন্ট করা

HTML ব্যাকগ্রাউন্ড কালার

HTML-এ কালার সিলেক্ট করার সময়, style অ্যাট্রিবিউট হেক্স কোড, HTML কালার নাম, RGB(A) কালার ভ্যালু, এবং HSL কালার ভ্যালু এক্সেপ্ট করে। RGB কালার এবং HSL কালারের কেসে, কালার সিস্টেমগুলো background-color ডিক্লেরেশনে ইনক্লুড করা থাকতে হবে। 

প্রতিটি কালার সিস্টেম ফরম্যাট করার উদাহরণ নিচে দেওয়া হল:

হেক্স কোড

<body style="background-color:#fbbd0e;"> </body> 

HTML কালার নাম

<body style="background-color:orange;"> </body> 

RGB কালার ভ্যালু

<body style="background-color:rgb(251,189,14);"> </body> 

RGBA কালার ভ্যালু

<body style="background-color:rgba(251,189,14,0.5);"> </body> 

HSL কালার ভ্যালু

<body style="background-color:hsl(44, 96%, 51%);"> </body> 

HSLA কালার ভ্যালু

<body style="background-color:hsla(44, 96%, 51%, 0.5);"> </body> 

একটি কথা নোট করুন: যদি এই মেথড ব্যবহার করে ব্যাকগ্রাউন্ড কালার সেট করেন, কিন্তু পরে একটি এক্সটার্নাল CSS ফাইল লিখেন, তবে আপনার HTML থেকে style অ্যাট্রিবিউট এবং background-color প্রোপার্টি রিমুভ করতে ভুলবেন না যাতে একটি স্টাইল অন্যটিকে ওভাররাইট না করে।

উপসংহার

এই আর্টিকেলে, আমরা আলোচনা করেছি HTML-এ ব্যাকগ্রাউন্ড কালার কীভাবে চেঞ্জ করতে হয়। আপনি যদি HTML-এ নতুন হন, তবে আমাদের গাইড চেক আউট করুন: Learn HTML: A Guide to Learning Hypertext Markup Language, অথবা আর্টিকেল পড়ুন How Long Does It Take to Learn HTML?


  1. HTML DOM Style backgroundColor প্রপার্টি

  2. HTML DOM Style background প্রপার্টি

  3. HTML Screen colorDepth প্রপার্টি

  4. HTML DOM Style color প্রপার্টি