HTML DOM borderImageWidth প্রপার্টি একটি এলিমেন্টের বর্ডার ইমেজের প্রস্থ সেট বা পাওয়ার জন্য ব্যবহৃত হয়।
সিনট্যাক্স
borderImageWidth প্রপার্টি সেট করার সিনট্যাক্স:
object.style.borderImageWidth = "number|%|auto|initial|inherit"
প্রপার্টি মানগুলো নিচে ব্যাখ্যা করা হলো:
| মান | বিবরণ |
|---|---|
| length | পিক্সেলে বর্ডার প্রস্থের আকার বর্ণনা করতে ব্যবহৃত হয়। |
| number | সঙ্গত বর্ডার প্রস্থের গুণফলে বর্ডার প্রস্থ বর্ণনা করতে ব্যবহৃত হয় এবং এর ডিফল্ট মান ১। |
| % | বর্ডার ইমেজ এলিয়ার আকারের জন্য অনুভূমিক এবং লম্বিক অফসেট বর্ণনা করতে ব্যবহৃত হয়। |
| auto | ইমেজের প্রস্থ এবং উচ্চতার সাথে মিলে যাওয়া প্রস্থ এবং উচ্চতা সেট করে। |
| initial | প্রপার্টিকে ডিফল্ট মানে সেট করার জন্য। |
| inherit | পিতামাতা এলিমেন্ট থেকে মান উত্তরাধিকার সূত্রে পাওয়ার জন্য। |
উদাহরণ
<!DOCTYPE html> <html> <head> <style> #DIV1 { width: 400px; padding: 25px; border-style: solid; border-color: transparent; border-image-slice: 30; border-image-source: url("https://www.tutorialspoint.com/ethereum/images/ethereum-mini-logo.jpg"); border-image-width: 10px; } </style> <script> function changeBorderWidth(){ document.getElementById("DIV1").style.borderImageWidth="30px"; document.getElementById("Sample").innerHTML="বর্ডার ইমেজ প্রস্থ এখন বেড়ে গেছে"; } </script> </head> <body> <div id="DIV1">HELLO</div> <p>নিচের বাটনে ক্লিক করলে উপরের div-এর বর্ডার ইমেজ প্রস্থ বাড়বে</p> <button onclick="changeBorderWidth()">বর্ডার প্রস্থ পরিবর্তন করুন</button> <p id="Sample"></p> </body> </html>
আউটপুট
বর্ডার প্রস্থ পরিবর্তন করুন বাটনে ক্লিক করলে:
