সিএসএস outline-color প্রোপার্টি
ব্রাউজার সাপোর্ট
| property | Google Chrome | Edge | Mozila Firefox | Safari | Opera |
|---|---|---|---|---|---|
| outline-color | ১.০ | ৮.০ | ১.৫ | ১.২ | ৭.০ |
সংজ্ঞা ও ব্যবহার
আউটলাইন হচ্ছে একটি লাইন যা বর্ডারের চারপাশে আঁকা হয় যার দ্বারা এলিমেন্টকে "স্ট্যান্ড আউট" করা হয়।
outline-color প্রোপার্টির মাধ্যমে আউটলাইনে কালার করা হয়।
পরামর্শঃ
- সবসময় outline-color প্রোপার্টির আগে outline-style ঘোষণা করতে হয়।কারন এলিমেন্টের কালার পরিবর্তন করার আগে আউটলাইন করতে হয়।
| Initial Value: | Inherited: | Animatable: |
|---|---|---|
| invert | না | হ্যাঁ । আরোও জানতে animatable অধ্যায় ভিজিট করুন। animatableএর উদাহরণ |
সিএসএস সিনট্যাক্স
outline-color: invert/color/initial/inherit;
ডটেড আউটলাইনের কালার করা:
উদাহরণ
<!DOCTYPE html>
<html>
<head>
<style>
p {
border: 1px solid orangered;
outline-style: dotted;
outline-color: teal;
}
</style>
</head>
<body>
<p><b>নোটঃ</b> যদি !DOCTYPE নির্দিষ্ট করে দেওয়া থাকে তাহলে আউটলাইন প্রোপার্টিটি ইন্টারনেট এক্সপ্লোরার ৮ এ সাপোর্ট করবে।</p>
</body>
</html>
ফলাফল
জাভাস্ক্রিপ্ট সিনট্যাক্স
object.style.outlineColor="#FF0000"উদাহরণঃ
<!DOCTYPE html>
<html>
<head>
<style>
#myDIV {
border: 1px solid black;
outline: teal dotted 5px;
width: 250px;
height: 200px;
}
</style>
</head>
<body>
<p> "উদাহরণ দেখি" বাটন ক্লিক করে div এলিমেন্টের আউটলাইন বর্ডারের কালার পরিবর্তন করা যায়।</p>
<button onclick="myFunction()">উদাহরণ দেখি</button>
<br><br>
<div id="myDIV">
<h1>হ্যালো ইমরান</h1>
</div>
<script>
function myFunction() {
document.getElementById("myDIV").style.outlineColor = "orangered";
}
</script>
<p><strong>নোটঃ</strong> ইন্টারনেট এক্সপ্লোরার ৯ এবং পূর্বের ভার্সনগুলোতে সিএসএস অ্যানিমেশন কাজ করে না।</p>
</body>
</html>
ফলাফল
outline-color প্রোপার্টির ভ্যালু-সমূহ
- invert - কালারের বিপর্যয় সৃষ্টি করে। এটি আউটলাইনের কালারের দৃশ্যমানতা তৈরি করে। এটি হচ্ছে ডিফল্ট।
- color -আউটলাইনের কালার নির্ধারন করে । সিএসএস কালার ভ্যালু এর সম্পূর্ন কালারের ভ্যালুগুলো দেওয়া হয়েছে।
- initial - সিএসএস প্রোপার্টির ডিফল্ট ভ্যালু সেট করে। আরও জানতে initial অধ্যায় ভিজিট করুন।
- inherit - এই প্রোপার্টির ভ্যালু প্যারেন্ট এলিমেন্ট থেকে উত্তরাধিকার সূত্রে পায়। আরও জানতে inherit অধ্যায় ভিজিট করুন।
outline-color প্রোপার্টির ভ্যালু-সমুহের ব্যবহার দেখার জন্য স্ব-স্ব ভ্যালুতে ক্লিক করুন।