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

HTML DOM style background-size প্রপার্টি ব্যবহার করে ব্যাকগ্রাউন্ড ইমেজের আকার সেট বা গেট করা হয়।

সিনট্যাক্স

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

object.style.backgroundSize = "auto|length|cover|contain|initial|inherit"

প্রপার্টি

উপরের প্রপার্টিগুলো নিচে ব্যাখ্যা করা হলো:

ক্রম	প্রপার্টি ও বিবরণ
১	auto ব্যাকগ্রাউন্ড ইমেজ পূর্ণ আকারে প্রদর্শিত হয় এবং এটি ডিফল্ট মান।
২	length ব্যাকগ্রাউন্ড ইমেজের প্রস্থ এবং উচ্চতা সেট করতে ব্যবহৃত হয়। প্রথম মান প্রস্থের জন্য এবং দ্বিতীয় মান উচ্চতার জন্য। যদি শুধু একটা মান দিয়ে থাকা হয় তবে বাকি auto হিসেবে ডিফল্ট হয়।
৩	percentage ব্যাকগ্রাউন্ড ইমেজের প্রস্থ এবং উচ্চতা শতাংশে সেট করতে ব্যবহৃত হয়। শতাংশ প্যারেন্টের প্রস্থ ও উচ্চতার উপর ভিত্তি করে হিসাব করা হয়। প্রথম মান প্রস্থ, দ্বিতীয় মান উচ্চতা সেট করে। শুধু একটা মান দিলে বাকি auto হয়।
৪	cover ব্যাকগ্রাউন্ড ইমেজকে এত বড় করতে ব্যবহৃত হয় যাতে পুরো ব্যাকগ্রাউন্ড এলাকা কভার হয়।
৫	contain ইমেজকে স্কেল করে যাতে এর প্রস্থ এবং উচ্চতা কন্টেন্ট এলাকার ভিতরে ফিট হয়।
৬	initial প্রপার্টিটিকে প্রাথমিক মান হিসেবে সেট করে।
৭	inherit প্যারেন্ট এলিমেন্ট থেকে প্রপার্টির মান উত্তরাধিকার হিসেবে গ্রহণ করে।

উদাহরণ

HTML DOM style backgroundSize প্রপার্টির উদাহরণ:

<!DOCTYPE html> <html> <head> <style> 
  #DIV1{ 
    box-shadow: 0 2px 0 4px mintcream; 
    padding: 45px; 
    background: url("https://www.tutorialspoint.com/plsql/images/plsql-mini-logo.jpg"); 
    background-size: 150px 150px; 
  } 
</style> 
<script> 
  function changeBackSize(){ 
    document.getElementById("DIV1").style.backgroundSize="100px 100px"; 
    document.getElementById("Sample").innerHTML="The background image size is now reduced"; 
  } 
</script> 
</head> 
<body> 
<h2>PL/SQL Tutorial</h2> 
<div id="DIV1"></div> 
<p>Change the background image size for the above div by clicking the below button</p> 
<button onclick="changeBackSize()">CHANGE SIZE</button> 
<p id="Sample"></p> 
</body> </html>

আউটপুট

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

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

CHANGE SIZE বাটনে ক্লিক করলে:

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