সিএসএস color প্রোপার্টি
ব্রাউজার সাপোর্ট
| property | Google Chrome | Edge | Mozila Firefox | Safari | Opera |
|---|---|---|---|---|---|
| color | ১.০ | ৩.০ | ১.০ | ১.০ | ৩.৫ |
সংজ্ঞা ও ব্যবহার
টেক্সটকে কালার করার জন্য কালার প্রোপার্টি ব্যবহার করা হয়।
পরামর্শঃ
- কোন টেক্সটকে সহজে পড়ার জন্য আমরা একই সাথে ব্যাকগ্রাউন্ড কালার এবং টেক্সট কালার ব্যবহার করতে পারি।
| Initial Value: | Inherited: | Animatable: |
|---|---|---|
| not specified | হ্যাঁ | হ্যাঁ । আরোও জানতে animatable অধ্যায় ভিজিট করুন। animatableএর উদাহরণ |
সিএসএস সিনট্যাক্স
color: color/initial/inherit;
বিভিন্ন এলিমেন্টের জন্য আলাদা আলাদা টেক্সট-কালার নির্ধারণঃ
উদাহরণ
<!DOCTYPE html>
<html>
<head>
<title>সিএসএস রেফারেন্স উদাহরণ</title>
<style>
body {
color: firebrick;
}
h1 {
color: #0000ff;
}
p.text {
color: rgb(120,30,150);
}
</style>
</head>
<body>
<h1>স্যাট একাডেমী</h1>
<p>এটি একটি p এলিমেন্ট যার কালার body তে সিলেক্ট করা কালার পাবে।</p>
<p class="text">এই p এলিমেন্টটিতে ক্লাস ব্যবহার করে ঐ ক্লাস সিলেক্ট করে কালার ব্যবহার করা হয়েছে।</p>
</body>
</html>
ফলাফল
জাভাস্ক্রিপ্ট সিনট্যাক্স
object.style.color="#0000FF"উদাহরণঃ
<!DOCTYPE html>
<html>
<head>
<title>সিএসএস রেফারেন্স উদাহরণ</title>
<style>
#thisDiv {
position: absolute;
width: 120px;
height: 120px;
background-color: teal;
}
</style>
</head>
<body>
<p> "ক্লিক করি" বাটনে ক্লিক করে DIV এলিমেন্টে ভিতরে থাকা টেক্সটের কালার পরিবর্তন করুন।</p>
<button onclick="myFunction()"> ক্লিক করি</button><br><br>
<div id="thisDiv">
<h1>DIV ELEMENT</h1>
</div>
<script>
function myFunction() {
document.getElementById("thisDiv").style.color = "white";
}
</script>
</body>
</html>
ফলাফল
color প্রোপার্টির ভ্যালু-সমূহ
- color - টেক্সটের কালার নির্দিষ্ট করে। কালার ভ্যালুর সম্পূর্ণ তালিকার জন্য সিএসএস কালার ভ্যালু দেখুন।
- initial - সিএসএস প্রোপার্টির ডিফল্ট ভ্যালু সেট করে। আরও জানতে initial অধ্যায় ভিজিট করুন।
- inherit - এই প্রোপার্টির ভ্যালু প্যারেন্ট এলিমেন্ট থেকে উত্তরাধিকার সূত্রে পায়। আরও জানতে inherit অধ্যায় ভিজিট করুন।
color প্রোপার্টির ভ্যালু-সমুহের ব্যবহার দেখার জন্য স্ব-স্ব ভ্যালুতে ক্লিক করুন।