HTML DOM borderTopColor প্রপার্টি একটি উপাদানের উপরের সীমানার রঙ পেতে বা সেট করতে ব্যবহার করা হয়।
−
-এর সিনট্যাক্স নিচে দেওয়া হলবর্ডারTopColor বৈশিষ্ট্য −
সেট করা হচ্ছেobject.style.borderTopColor = "color|transparent|initial|inherit"
উপরের বৈশিষ্ট্যগুলি নিম্নরূপ ব্যাখ্যা করা হয়েছে -
| মান | বিবরণ |
|---|---|
| রঙ | শীর্ষ সীমানার রঙ নির্দিষ্ট করার জন্য। এর ডিফল্ট রঙ কালোতে সেট করা আছে। |
| স্বচ্ছ | উপরের সীমানার রঙকে স্বচ্ছ করে তোলে এবং অন্তর্নিহিত বিষয়বস্তু দেখা যায়। |
| প্রাথমিক | এই সম্পত্তি ডিফল্ট মান সেট করার জন্য। |
| উত্তরাধিকার | অভিভাবক সম্পত্তি মান উত্তরাধিকারসূত্রে পেতে। |
আসুন আমরা বর্ডারটপকলার প্রপার্টি -
-এর একটি উদাহরণ দেখিউদাহরণ
<!DOCTYPE html>
<html>
<head>
<style>
#IMG1 {
border-top:solid 8px;
border-top-color: orange;
}
</style>
<script>
function changeBorderTop(){
document.getElementById("IMG1").style.borderTopColor="blue";
document.getElementById("Sample").innerHTML="The border top color is now changed to blue";
}
</script>
</head>
<body>
<img id="IMG1" src="https://www.tutorialspoint.com/blue_prism/images/blueprism-logo.jpg?auto=compress&cs=tinysrgb&dpr=2&h=550&w=150">
<p>Change the above image border top color by clicking the below button</p>
<button onclick="changeBorderTop()">Change Border Color</button>
<p id="Sample"></p>
</body>
</html> আউটপুট
“সীমানার রঙ পরিবর্তন করুন এ ক্লিক করলে ” বোতাম -
উপরের উদাহরণে -
আমরা "IMG1" আইডি দিয়ে একটি ইমেজ এলিমেন্ট তৈরি করেছি যেটিতে একটি সিএসএস স্টাইল প্রয়োগ করা হয়েছে। CSS শৈলী বর্ডার টপ স্টাইল এবং বর্ডার টপ কালার উল্লেখ করে।
#IMG1 {
border-top:solid 8px;
border-top-color: orange;
}
<img id="IMG1" src="https://www.tutorialspoint.com/blue_prism/images/blueprism-logo.jpg?auto=compress&cs=tinysrgb&dpr=2&h=550&w=150
"> তারপরে আমরা “চেঞ্জ বর্ডার কালার” নামে একটি বোতাম তৈরি করেছি যা ব্যবহারকারীর দ্বারা ক্লিক করার পরে changeBorderTop() পদ্ধতিটি কার্যকর করবে −
<button onclick="changeBorderTop()">Change Border Color</button>
changeBorderTop() মেথড getElementById() মেথড ব্যবহার করে id “IMG1” সহ এলিমেন্ট পায় এবং এর বর্ডারTopColor স্টাইলের প্রপার্টি নীল করে দেয়। এটি উপরের সীমানার রঙটিকে নীলে পরিবর্তন করে এবং "নমুনা" আইডি সহ অনুচ্ছেদে এই পরিবর্তনটি তার অভ্যন্তরীণ HTML বৈশিষ্ট্য ব্যবহার করে প্রদর্শন করে -
function changeBorderTop(){
document.getElementById("IMG1").style.borderTopColor="blue";
document.getElementById("Sample").innerHTML="The border top color is now changed to blue";
} 