HTML DOM বর্ডার রেডিয়াস প্রপার্টিটি উপাদানটির চার পাশে বৃত্তাকার কোণ যোগ করতে ব্যবহৃত হয়। এই প্রপার্টি ব্যবহার করে, আমরা বর্ডার টপ লেফট রেডিয়াস, বর্ডার টপরাইট রেডিয়াস, বর্ডারবটমরাইট রেডিয়াস, বর্ডারবটম লেফট রেডিয়াস এর মত বর্ডার ব্যাসার্ধের বৈশিষ্ট্যগুলি সেট করতে এবং পেতে পারি৷
−
-এর সিনট্যাক্স নিচে দেওয়া হলবর্ডার রেডিয়াস সম্পত্তি সেট করা হচ্ছে:
object.style.borderRadius = "1-4 length|% / 1-4 length|%|initial|inherit"
সম্পত্তি মান নিম্নরূপ ব্যাখ্যা করা হয় −
| মান | বিবরণ |
|---|---|
| দৈর্ঘ্য | সীমানা আকার সংজ্ঞায়িত করার জন্য। |
| % | শতাংশে সীমানা আকৃতি সংজ্ঞায়িত করার জন্য। |
| প্রাথমিক | প্রাথমিক মান এই সম্পত্তি সেট করার জন্য। |
| উত্তরাধিকার | অভিভাবক সম্পত্তি মান উত্তরাধিকারসূত্রে পেতে |
আসুন বর্ডাররেডিয়াস প্রপার্টি −
এর একটি উদাহরণ দেখিউদাহরণ
<!DOCTYPE html>
<html>
<head>
<style>
#DIV1{
height: 100px;
width: 200px;
border: 10px groove orange;
padding: 10px;
border-radius: 1px 1px 1px 1px;
}
</style>
<script>
function changeBorderRadius(){
document.getElementById("DIV1").style.borderRadius="45px 45px 45px 45px";
document.getElementById("Sample").innerHTML="The border radius for the four borders of the above div are now increased";
}
</script>
</head>
<body>
<div id="DIV1">SOME SAMPLE TEXT</div>
<p>Increase the above div border radius size by clicking the below button</p>
<button onclick="changeBorderRadius()">Change Border Radius</button>
<p id="Sample"></p>
</body>
</html> আউটপুট
"চেঞ্জ বর্ডার রেডিয়াস" বোতামে ক্লিক করলে -
