Style objectFit বৈশিষ্ট্য

সংজ্ঞা ও ব্যবহার

objectFit বৈশিষ্ট্যটি <img> বা <video> এর মাপকাঠিতে কীভাবে পরিবর্তন করা হবে তা নির্ধারণ করে。

এই বৈশিষ্ট্যটি কনটেন্টকে বিভিন্ন পদ্ধতিতে কনটেনারে পূর্ণ করার জন্য জানায়; যেমন "অনুপাত রাখা" বা "যতটা সম্ভব স্থান পূর্ণ করা"।

অন্যান্য দেখুন:

CSS শিক্ষাCSS object-fit

CSS পরিচ্ছেদকobject-fit বৈশিষ্ট্য

উদাহরণ

ছবির দুই পাশে কাট দিন, অনুপাত রাখতে এবং স্থান পূর্ণ করুন:

document.getElementById("myImg").style.objectFit = "cover";

স্বয়ং প্রয়াস করুন

সংজ্ঞায়িত

objectFit বৈশিষ্ট্য ফেরত দিন:

object.style.objectFit

objectFit বৈশিষ্ট্য সংজ্ঞায়িত করুন:

object.style.objectFit = "fill|contain|cover|scale-down|none|initial|inherit"

বৈশিষ্ট্য মান

মান বর্ণনা
fill ডিফল্ট। প্রতিস্থাপন করা কনটেন্টটির মাপকাঠিতে পরিবর্তন করে, এলিমেন্টের কনটেন্ট বক্সকে পূর্ণ করতে হবে। প্রয়োজন হলে, অবজেক্টটি সার্বভৌম করা হবে বা সংকুচিত করা হবে。
contain প্রতিস্থাপন করা কনটেন্টটির অনুপাত রাখতে হবে, তারপর তা এলিমেন্টের কনটেন্ট বক্সকে সার্বভৌম করতে হবে。
cover প্রতিস্থাপন করা কনটেন্টটির মাপকাঠিতে পরিবর্তন করে, পূর্ণ কনটেন্ট বক্সকে পূর্ণ করতে কাজ করতে যায়, তার অস্থির অনুপাত রাখতে হবে। এই অবজেক্টটি কাটা হবে。
none প্রতিস্থাপন করা কনটেন্টটির মাপকাঠিতে কোনও পরিবর্তন করা হবে না。
scale-down কনটেন্টের মাপকাঠিতে নীল বা contain এর একটির সমান হবে; একটির অন্যটির থেকে কোনও কিছু কম হলে তা নির্ধারিত হবে。
initial এই বৈশিষ্ট্যটিকে তার ডিফল্ট মানে নিয়ে যান। দেখুন initial
inherit এই বৈশিষ্ট্যটি পিতৃ তত্ত্বকে থেকে উত্তরসূরী করে নেয়। দেখুন inherit

প্রযুক্তিগত বিবরণ

ডিফল্ট মান: fill
ফলাফল: স্ট্রিং যা প্রতিটি তত্ত্বকে object-fit বৈশিষ্ট্য
CSS সংস্করণ: CSS3

ব্রাউজার সমর্থন

সমূহটিতে সংখ্যা বর্ণনা করল যে এই বৈশিষ্ট্যটির পূর্ণ সমর্থনকারী প্রথম ব্রাউজারের সংস্করণ。

চ্রোম এজ ফায়ারফক্স স্যাফারি অপেরা
চ্রোম এজ ফায়ারফক্স স্যাফারি অপেরা
31.0 16.0 36.0 7.1 19.0