--- title: রং slug: Learn/CSS/Building_blocks/Values_and_units tags: - CSS - Example - Guide - NeedsReview translation_of: Learn/CSS/Introduction_to_CSS/Values_and_units#Colors translation_of_original: Web/Guide/CSS/Getting_started/Color original_slug: Web/CSS/Getting_Started/Color ---
{{ CSSTutorialTOC() }}
{{previousPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Text_styles", "Text styles")}}এটা হচ্ছে যেভাবে শুরু করবেন CSS টিউটোরিয়ালের ৮ম বিভাগ; এটা ব্যাখ্যা করবে কিভাবে আপনি CSS এ রং উল্লেখ করবেন. আপনি আপনার নমুনা স্টাইলশিট এ পরিচিত হবেন background রং এর সাথে।
এই টিউটোরিয়ালে এখন পর্যন্ত ,আপনি ব্যবহার করেছেন একটি নির্দিষ্ট সংখ্যক রং এর নাম . CSS 2 সর্বোপরি ১৭ টি রং এর নাম বহন করে। কিছু নাম হয় তো সেগুলো, যেগুলো আপনি আশা করেন না।
black | gray | silver | white | |||||||||||
primaries | red | lime | blue | |||||||||||
secondaries | yellow | aqua | fuchsia | |||||||||||
maroon | orange | olive | purple | green | navy | teal |
আপনার browser হয়ত আরও অনেক রং এর নাম বহন করতে পারে, যেমনঃ
dodgerblue | peachpuff | tan | firebrick | aquamarine |
এই প্রসারিত তালিকার আরও বিস্তারিত জানার জন্য দেখুন: SVG color keywords CSS 3 এর রং এর মডিউল এ। সতর্ক থাকুন ওই সব রং এর নাম ব্যবহারে যেগুলো আপনার পাঠকের browsers এ হয়ত বহন করে না।
একটি বৃহৎ palette এর জন্য, যে রং গুলো আপনি চান সেগুলোর লাল (red), সবুজ(green) এবং নীল( blue) উপাদানগুলো উল্লেখ করুন হ্যাশট্যাগ (#) দিয়ে এবং ৩টি হেক্সাডেসিমাল(hexadecimal) সংখ্যা যাদের শ্রেণী 0 - 9 , a – f. a – f অক্ষরগুলো দিয়ে 10 – 15 এর মান বুঝায়:
black | #000 |
|
pure red | #f00 |
|
pure green | #0f0 |
|
pure blue | #00f |
|
white | #fff |
সম্পূর্ণ palette এর জন্য, প্রতিটি উপাদানের ক্ষেত্রে উল্লেখ করুন দুইটি হেক্সাডেসিমাল সংখ্য:
black | #000000 |
|
pure red | #ff0000 |
|
pure green | #00ff00 |
|
pure blue | #0000ff |
|
white | #ffffff |
আপনি সচারচর এই ৬ সংখ্যার হেক্সাডেসিমাল কোড গুলো আপনার গ্রাফিক্স প্রোগ্রাম অথবা অন্য কোন টুলস থেকে পেতে পারেন।
শুরু লাল এর সাথে: | #f00 |
|
একে হাল্কা করার জন্য, কিছু সবুজ এবং নীল যোগ করুনঃ | #f77 |
|
একে আরও কমলা করার জন্য, সামান্য একটু এক্সট্রা সবুজ যোগ করুনঃ | #fa7 |
|
আরও ডার্ক করার জন্য, এর সব উপাদান মুছে ফেলুন: | #c74 |
|
এর সম্পৃক্তি দূর করার জন্য, এর উপাদান গুলো কে আরও সমান করুনঃ | #c98 |
|
আপনি যদি একদম সমান করেন তাহলে আপনি পাবেন ধুুসরঃ | #ccc |
একটি মোমের মত শেডের জন্য যেমন বর্ণহীন নীলঃ
শুরু একদম শুভ্র সাদা থেকে: | #fff |
|
অন্যান্য উপাদানগুলো সামান্য কমান: | #eef |
আপনি আরও উল্লেখ করতে পারেন একতি রং এর ডেসিমাল RGB মানগনগুলো যাদের শ্রেণী 0 – 25 অথবা percentages.
উদাহরণস্বরূপ ,মেরুন (dark red):
rgb(128, 0, 0)
কিভাবে রং উল্লেখ করা যায় তার আরও বিস্তারিত জানার জন্য দেখুনঃ রং CSS সুনির্দিষ্টকরণে এ। ম্যাচিং সিস্টেম রং যেমন মেনু এবং ThreeDFace, দেখুন: CSS2 System Colors CSS সুনির্দিষ্টকরণে এ।
আপনি ইতিমধ্যে {{ cssxref("color") }} প্রপার্টি text এ ব্যবহার করেছেন ।
আপনি চাইলে আরও ব্যবহার করতে পারেন {{ cssxref("background-color") }} প্রপার্টি টি যাতে করে আপনি উপাদানগুলোর ব্যাকগ্রাউন্ড পরিবর্তন করতে পারেন।
ব্যাকগ্রাউন্ড টি আপনি সেট করতে পারেন স্বচ্ছ ভাবে যাতে করে আপনি স্পষ্টভাবে যে কোন রং মুছে ফেলতে পারেন, মূল উপাদানের ব্যাকগ্রাউন্ড প্রকাশ করে।
এই টিউটোরিয়ালে উদাহরণ বাক্সগুলোতে বর্ণহীন হলুদ ব্যাকগ্রাউন্ড ব্যবহার করা হয়েছে:
background-color: #fffff4;
আরও বিস্তারিত বাক্সগুলো এই বর্ণহীন ধূসর ব্যবহার করেছেঃ
background-color: #f4f4f4;
/*** CSS Tutorial: Color page ***/ /* page font */ body {font: 16px "Comic Sans MS", cursive;} /* paragraphs */ p {color: blue;} #first {font-style: italic;} /* initial letters */ strong { color: red; background-color: #ddf; font: 200% serif; } .carrot {color: red;} .spinach {color: green;}
Cascading Style Sheets |
Cascading Style Sheets |
প্রতিদন্দিতাঃ (এটা হয়ত একদম সঠিক ভাবে হবে না, কিন্তু আপনি কাছাকাছি যেতে পারবেন। একদম সঠিক ভাবে করার জন্য আপনার প্রয়োজন 6 ডিজিট এর কোডসমূহ, এবং প্রয়োজন CSS সুনির্দিষ্টকরন দেখা অথবা ব্যবহার করুন একটি গ্রাফিক্স টুল যাতে করে কালার গুলো মিল করাতে পারেন।) |
{{nextPage("/en-US/docs/Web/Guide/CSS/Getting_Started/Content", "Content")}}আপনার নমুনা ডকুমেন্ট এবং আপনার নমুনা stylesheet এর থেকে সম্পূর্ণভাবে আলাদা। এর পরে পরবর্তী বিভাগ ব্যাখ্যা করবে কেমন করে আপনি এই সম্পূর্ণ আলাদা জিনিস থেকে ভিন্ন কিছু তৈরি করবেন।