CSS inset-inline অপারেটর

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

inset-inline এই এক্সপ্রোপার্টি সংজ্ঞায়িত করা হল এমন এক্সপ্রোপার্টি যা এলাকা সারিতে সাধারণ পিতৃ এক্সপ্রোপার্টির সাথে দূরত্ব নির্ধারণ করে。

নোট:এই এক্সপ্রোপার্টির কার্যকারিতা করতে হলে, প্রয়োজনীয় হল নিচের এক্সপ্রোপার্টি সংজ্ঞায়িত করা: position এক্সপ্রোপার্টি。

inset-inline এই এক্সপ্রোপার্টি হল নিচের এক্সপ্রোপার্টির সংক্ষিপ্ত রূপ:

inset-inline এই এক্সপ্রোপার্টির মান বিভিন্ন পদ্ধতিতে সংজ্ঞায়িত করা যেতে পারে:

যদি inset-inline এক্সপ্রোপার্টির দুটি মান থাকে:

inset-inline: 10px 50px;
  • ভাবা প্রান্তের দূরত্ব 10px
  • শেষ প্রান্তের দূরত্ব 50px

যদি inset-inline বৈশিষ্ট্যটিকে একটি মান থাকে:

inset-inline: 10px;
  • ভাব এবং শেষ ভাবের দূরত্বগুলি 10px

CSS-এর inset-inline এবং inset-block বৈশিষ্ট্যগুলি CSS-এর top、bottom、left এবং right বৈশিষ্ট্যটি অত্যন্ত সমান, কিন্তু inset-block এবং inset-inline বৈশিষ্ট্যটি ব্লক দিশা এবং সার্বিক দিশা-প্রতি নির্ভর করে。

নোট:সংশ্লিষ্ট CSS বৈশিষ্ট্য writing-mode এবং direction সার্বিক দিশা নির্দিষ্ট করে। এটি সার্বিক দিশার ভাব এবং শেষ ভাব নির্দেশ করে, এবং inset-inline বৈশিষ্ট্যের ফলাফল। ইংরেজি পাতার জন্য, সার্বিক দিশা বাম থেকে ডানে এবং ব্লক দিশা নিচ থেকে উপরে হয়。

প্রতিমান

উদাহরণ 1

স্থানীয় <div> এলিমেন্টকে সার্বিক দিশায় পিতৃত্ব এলিমেন্ট থেকে দূরত্ব নির্ধারণ করুন:

div {
  inset-inline: 10px 50px;
}

আপনার নিজেই প্রয়াস করুন

উদাহরণ 2

যখন <div> এলিমেন্টের writing-mode যখন বৈশিষ্ট্য মান vertical-rl হয়, সার্বিক দিশা নিচ থেকে উপরে হয়। ফলস্বরূপ, এলিমেন্টের ভাব বাম থেকে উপরে এবং শেষ থেকে ডানে সরে যায়:

div {
  inset-inline: 15px 30px;
  writing-mode: vertical-rl;
}

আপনার নিজেই প্রয়াস করুন

উদাহরণ 3

যখন <div> এলিমেন্টের direction যখন বৈশিষ্ট্য মান rtl হয়, সার্বিক দিশা ডান থেকে বামে হয়। ফলস্বরূপ, এলিমেন্টের ভাব বাম থেকে ডানে এবং শেষ থেকে বামে সরে যায়:

div {
  inset-inline: 15px 30px;
  direction: rtl;
}

আপনার নিজেই প্রয়াস করুন

CSS গঠনশৈলী

inset-inline: auto|length|initial|inherit;

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

মান বর্ণনা
auto ডিফল্ট মান। এলিমেন্টের ডিফল্ট inset-inline দূরত্ব
length px, pt, cm ইত্যাদি ইউনিটে দূরত্ব নির্দিষ্ট করুন। নেতিবাচক মানগুলি অনুমোদিত হয়। দেখুন:CSS ইউনিট。
% পিতৃত্ব এলিমেন্টের প্রতি অনুরূপ অক্ষের পরিমাণের প্রতিশত দূরত্ব নির্দিষ্ট করুন。
initial এই বৈশিষ্ট্যটিকে তার ডিফল্ট মানে সংযোজিত করুন। দেখুন initial。
inherit এই বৈশিষ্ট্যটি তার পিতৃত্ব এলিমেন্ট থেকে উত্তরণ করা হয়। দেখুন inherit。

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

ডিফল্ট মান: auto
উত্তরণযোগ্যতা: না
অ্যানিমেশন নির্মাণ: সমর্থন করা হয়। দেখুন:অ্যানিমেশন-সংক্রান্ত বৈশিষ্ট্য。
সংস্করণ: CSS3
জেভাস্ক্রিপ্ট গঠনশৈলী: object.style.insetInline="100px 50px"

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

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

চ্রোম এজ ফায়ারফক্স সাফারি অপেরা
87.0 87.0 63.0 14.1 73.0

সংক্রান্ত পাতা

শিক্ষা:CSS অবস্থান

উল্লেখ:CSS position প্রক্রিয়া

উল্লেখ:CSS ডাইরেকশন এট্রিবিউট

উল্লেখ:CSS writing-mode অতিবিধি