HTML DOM শৈলী flexBasis বৈশিষ্ট্য ফ্লেক্স প্রদর্শন সহ একটি উপাদানের প্রাথমিক আকার নির্দিষ্ট করতে ব্যবহৃত হয়। flexBasis প্রপার্টি ফ্লেক্স-বেসিসের জন্য স্বয়ংক্রিয় থেকে অন্য যেকোনো মানের জন্য প্রস্থের চেয়ে বেশি অগ্রাধিকার পায়।
−
-এর সিনট্যাক্স নিচে দেওয়া হলflexBasis সম্পত্তি সেট করা হচ্ছে -
object.style.flexBasis = "number|auto|initial|inherit"
উপরের বৈশিষ্ট্যগুলি নিম্নরূপ ব্যাখ্যা করা হয়েছে -
| মান | বর্ণনা |
|---|---|
| সংখ্যা | শতাংশে বা যেকোনো আইনি দৈর্ঘ্য ইউনিটে নমনীয় আইটেমগুলির প্রাথমিক দৈর্ঘ্য নির্দিষ্ট করা। |
| অটো | নমনীয় আইটেমের দৈর্ঘ্যের সমান দৈর্ঘ্য সেট করে৷ যদি দৈর্ঘ্য নির্দিষ্ট না হয় তবে এটি তার বিষয়বস্তু অনুযায়ী হবে। এটি ডিফল্ট মান. |
| প্রাথমিক | এই প্রপার্টি ফরসেট করা হচ্ছে প্রারম্ভিক মান। |
| উত্তরাধিকার | অভিভাবক সম্পত্তি মান উত্তরাধিকারসূত্রে প্রাপ্ত করুন৷ |
আসুন flexBasis প্রপার্টি -
-এর জন্য একটি উদাহরণ দেখিউদাহরণ
<!DOCTYPE html>
<html>
<head>
<style>
#demo, #demo2{
background-color: #fff8dc;
margin: 10px;
height: 100px;
box-shadow: 0 0 0 4px brown;
display: flex;
}
#demo div {
flex-basis: 110px;
}
</style>
<script>
function changeFlexBasis() {
for(var i=1;i<3;i++){
document.getElementsByTagName("DIV")[i].style.flexBasis="200px";
}
document.getElementById("Sample").innerHTML="The flex basis value is increased to 200px";
}
</script>
</head>
<body>
<h2>Demo Heading</h2>
<div id="demo">
<div><img src="https://www.tutorialspoint.com/images/home_tensor_flow.png"></div>
<div><img src="https://www.tutorialspoint.com/images/home_blockchain_python.png"></div>
<div><img src="https://www.tutorialspoint.com/images/multilanguage-tutorials.png"></div>
</div>
<p>Change the flex basis property for the image present inside divs by clicking the below button</p>
<button onclick="changeFlexBasis()">Change Flex Basis</button>
<p id="Sample"></p>
</body>
</html> আউটপুট
“চেঞ্জ ফ্লেক্স বেসিস ক্লিক করলে ” বোতাম -
