HTML DOM Style borderBottomStyle প্রপার্টি

borderBottomStyle প্রপার্টি ব্যবহার করে একটি এলিমেন্টের নিচের বর্ডারের লাইন স্টাইল সেট বা গেট করা হয়।

সিনট্যাক্স

borderBottomStyle প্রপার্টি সেট করার সিনট্যাক্স:

object.style.borderBottomStyle = value

মানসমূহ

ক্রম	মান ও বিবরণ
১	none ডিফল্ট মান, কোনো বর্ডার সংজ্ঞায়িত করে না।
২	hidden "none"-এর মতোই কিন্তু বর্ডার স্পেস নেবে। এটি বেসিক্যালি ট্রান্সপারেন্ট কিন্তু আছে।
৩	dotted ডটেড বর্ডার সংজ্ঞায়িত করে।
৪	dashed ড্যাশড বর্ডার সংজ্ঞায়িত করে।
৫	solid সলিড বর্ডার সংজ্ঞায়িত করে।
৬	double ডাবল বর্ডার সংজ্ঞায়িত করে।
৭	groove ৩D গ্রুভ বর্ডার সংজ্ঞায়িত করে এবং ridge-এর বিপরীত।
৮	ridge ৩D রিজড বর্ডার সংজ্ঞায়িত করে এবং groove-এর বিপরীত।
৯	inset ৩D ইনসেট বর্ডার সংজ্ঞায়িত করে এবং ইফেক্ট যেন এমবেডেড লাগে। outset-এর বিপরীত ইফেক্ট তৈরি করে।
১০	outset ৩D আউটসেট বর্ডার সংজ্ঞায়িত করে এবং ইফেক্ট যেন এমবসড লাগে। inset-এর বিপরীত ইফেক্ট তৈরি করে।
১১	initial প্রপার্টিটিকে প্রাথমিক মান হিসেবে সেট করে।
১২	inherit প্যারেন্ট এলিমেন্ট থেকে প্রপার্টির মান উত্তরাধিকার হিসেবে গ্রহণ করে।

উদাহরণ

borderBottomStyle প্রপার্টির উদাহরণ:

<!DOCTYPE html> <html> <head> <style> 
  #DIV1{ 
    width:300px; 
    height:100px; 
    border-bottom: 8px solid dodgerblue; 
    border-bottom-style: groove; 
  } 
</style> 
<script> 
  function changeBottomStyle(){ 
    document.getElementById("DIV1").style.borderBottomStyle="dashed"; 
    document.getElementById("Sample").innerHTML="The bottom border style is now changed"; 
  } 
</script> 
</head> 
<body> 
<div id="DIV1">SOME SAMPLE TEXT</div> 
<p>Change the div bottom border style size by clicking the below button</p> 
<button onclick="changeBottomStyle()">Change Bottom Style</button> 
<p id="Sample"></p> 
</body> </html>

আউটপুট

নিচের আউটপুট তৈরি হবে:

HTML DOM Style borderBottomStyle প্রপার্টি

"Change Bottom Style" বাটনে ক্লিক করলে:

HTML DOM Style borderBottomStyle প্রপার্টি