সিএসএস(৩) border-top-left-radius প্রোপার্টি
ব্রাউজার সাপোর্ট
| property | Google Chrome | Edge | Mozila Firefox | Safari | Opera |
|---|---|---|---|---|---|
| border-top-left-radius | ৫.০ | ৯.০ | ৪.০ | ৫.০ | ১০.৫ |
সংজ্ঞা ও ব্যবহার
border-top-left-radius প্রোপার্টি দিয়ে বর্ডারের top-left কর্ণারের আকৃতি বুঝায়।
পরামর্শঃ
- এই প্রোপার্টি দিয়ে এলিমেন্টে বৃত্তাকার বর্ডার যোগ করা যায়।
| Initial Value: | Inherited: | Animatable: |
|---|---|---|
| ০ | না | হ্যাঁ । আরোও জানতে animatable অধ্যায় ভিজিট করুন। animatableএর উদাহরণ |
সিএসএস সিনট্যাক্স
border-top-left-radius: length/% [length/%]/initial/inherit;
পরামর্শঃ
- প্রথম ভ্যালুটি অনুভূমিক ব্যাসার্ধ, দ্বিতীয় ভ্যালুটি উল্লম্ব ব্যাসার্ধ। যদি দ্বিতীয় ভ্যালুটি না দেওয়া হয় তবে এটি প্রথম ভ্যালু থেকে নিজের মান নিয়ে নিবে। যদি যেকোন একটি ভ্যালু শূন্য হয়, কর্ণার গোলাকার না হয়ে বর্গাকার হবে। অনুভূমিক ব্যাসার্ধের শতকরা বর্ডার বক্সের প্রস্থকে বুঝায়, এখানে উল্লম্ব ব্যাসার্ধ বর্ডার বক্সের উচ্চতাকে বুঝায়।
<div> এলিমেন্টের top-left কর্ণারে বৃত্তাকার বর্ডার যোগ করিঃ
উদাহরণ
<!DOCTYPE html>
<html>
<head>
<style>
p {
border: 2px solid green ;
padding: 15px;
background:yellowgreen;
border-top-left-radius: 3em;
}
</style>
</head>
<body>
<p> border-top-left-radius প্রোপার্টি এর মাধ্যমে top-left কর্ণারে গোলাকার বর্ডার করে।</p>
</body>
</html>
ফলাফল
জাভাস্ক্রিপ্ট সিনট্যাক্স
object.style.borderTopLeftRadius="50px"উদাহরণ
<!DOCTYPE html>
<html>
<head>
<style>
#thisDIV {
border: 3px solid red;
width: 350px;
height: 200px;
}
</style>
</head>
<body>
<p>" পরিবর্তন করি" বাটন ক্লিক করে DIV এলিমেন্টের border-top-left-radius পরিবর্তন করি: </p>
<button onclick="myFunction()"> পরিবর্তন করি</button>
<div id="thisDIV">
<h1> স্যাট একাডেমী</h1>
</div>
<script>
function myFunction() {
document.getElementById("thisDIV").style.borderTopLeftRadius = "50px";
}
</script>
</body>
</html>
ফলাফল
border-top-left-radius প্রোপার্টির ভ্যালু-সমূহ
- length - top-left কর্ণারের আকৃতি নির্দেশ করে।
- % -top-left কর্ণারের আকৃতি % এ নির্দেশ করে।
- initial - সিএসএস প্রোপার্টির ডিফল্ট ভ্যালু সেট করে। আরও জানতে initial অধ্যায় ভিজিট করুন।
- inherit - এই প্রোপার্টির ভ্যালু প্যারেন্ট এলিমেন্ট থেকে উত্তরাধিকার সূত্রে পায়। আরও জানতে inherit অধ্যায় ভিজিট করুন।
border-top-left-radius প্রোপার্টির ভ্যালু-সমুহের ব্যবহার দেখার জন্য স্ব-স্ব ভ্যালুতে ক্লিক করুন।