CSS margin-inline অপারেটর

বিবরণ ও প্রয়োগ

margin-inline প্রতিযোগীতা নির্দিষ্ট হলো একটি লাইনের দিকের শুরু ও শেষের বাইরের মার্জিন এবং নিম্নলিখিত প্রতিযোগীতার সংক্ষিপ্ত প্রতিযোগীতা

margin-inline প্রতিযোগীতার মানগুলো বিভিন্ন পদ্ধতিতে নির্ধারিত করা যেতে পারে:

যদি margin-inline প্রতিযোগীতা দুইটি মান হোক:

margin-inline: 10px 50px;
  • ভাবের মার্জিন 10px
  • শেষের বাইরের মার্জিন 50px

যদি margin-inline প্রতিযোগীতা একটি মান হোক:

margin-inline: 10px;
  • শুরু এবং শেষ সময়ের margin সকলটি 10px

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

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

উদাহরণ

উদাহরণ 1

দিক অবস্থানের উভয় পাশের margin-inline নির্দিষ্ট করুন:

div {
  margin-inline: 35px;
}

স্বয়ংক্রিয়ভাবে প্রয়োগ করুন

উদাহরণ 2

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

div {
  margin-inline: 10px 50px;
  writing-mode: vertical-rl;
}

স্বয়ংক্রিয়ভাবে প্রয়োগ করুন

উদাহরণ 3

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

div {
  margin-inline: 10px 50px;
  direction: rtl;
}

স্বয়ংক্রিয়ভাবে প্রয়োগ করুন

CSS গঠনশৈলী

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

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

মান বিবরণ
auto ডিফল্ট মান
length

px, pt, cm ইত্যাদির ইউনিটে margin-inline নির্দিষ্ট করুন। নেতিবাচক মানও অনুমোদিত

দেখুন:CSS ইউনিট。
% পিতৃত্ব বিন্যাসের পাশাপাশি দিক অবস্থানের প্রতি সমানভাবে margin-inline নির্দিষ্ট করুন。
initial এই বৈশিষ্ট্যটি তার ডিফল্ট মানে সংযোজিত হয়। দেখুন initial。
inherit এই বৈশিষ্ট্যটি তার পিতৃত্ব বিন্যাস থেকে উত্তরসূরী হয়। দেখুন inherit。

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

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

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

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

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

সংশ্লিষ্ট পৃষ্ঠা

উল্লেখ:CSS দিশা প্রতিভা

উল্লেখ:CSS margin-inline-end অপারেটর

উল্লেখ:CSS margin-inline-start অপারেটর

উল্লেখ:CSS margin-bottom অপারেটর

উল্লেখ:CSS margin-inline অপারেটর

উল্লেখ:CSS margin-left অপারেটর

উল্লেখ:CSS margin-right অপারেটর

উল্লেখ:CSS margin-top অপারেটর

উল্লেখ:CSS writing-mode এটি