CSS scroll-margin-left অপারেশন

পরিভাষা এবং ব্যবহার

scroll-margin-left বৈশিষ্ট্যটি দ্বারা।

সন্ধান স্থান বলতে বোঝায় যে সন্ধান স্থানটি স্ক্রোল থেকে থামার সময়, সন্ধান স্থানটি কনটেনারের মধ্যে কোথায় স্থায়ী হয়। সন্ধান স্থানটি নির্ধারিত হয় এবং বৈশিষ্ট্যটি নির্ধারিত হয়েছে direction scroll-snap-align writing-mode প্রভাব

উপদেশ:এই বৈশিষ্ট্যটি শুধুমাত্র সন্ধান স্থানটি সন্ধান স্থানের ডানদিকে নির্ধারিত হলেই কার্যকরী হয়。

দেখার জন্য scroll-margin-left এবং scroll-margin-left scroll-snap-align এবং বৈশিষ্ট্যটি scroll-snap-type বৈশিষ্ট্য

উদাহরণ

উদাহরণ 1

স্ক্রোল স্থানটির সঙ্গে কনটেনারের বাহ্যিক মার্জিনটিকে 20px নিয়ে নিন:

div {
  scroll-margin-left: 20px;
}

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

উদাহরণ 2: ছবি সংকলন

scroll-margin-left বৈশিষ্ট্যটি সমর্থনকারী ছবি গ্যালারিতে ব্যবহার করা যায়। এখানে:scroll-margin-left ব্যবহারকারীকে জানানো যায় যে ডানদিকেও একটি ছবি আছে। প্রথম ছবিটি স্ক্রোল করে প্রভাব দেখুন:

#container > img {
  scroll-margin-left: 30px;
}

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

উদাহরণ 3: সন্ধান স্থান

যাতে: scroll-margin-left বৈশিষ্ট্যটি কার্যকরী হয়, সন্ধান স্থানটি সন্ধান স্থানের ডানদিকে নির্ধারিত হতে হবে। এই উদাহরণে:direction বৈশিষ্ট্যটি সন্ধান স্থানটিকে সন্ধান স্থান থেকে সন্ধান স্থানের ডানদিকে পরিবর্তন করে।এই ধরণের কোড ব্যবহার করে:scroll-margin-left বৈশিষ্ট্য আর কাজ করবে না:

#container {
  direction: rtl;
}
#container > div {
  scroll-margin-left: 30px;
  scroll-snap-align: none start;
}

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

CSS সুত্র

scroll-margin-left: 0|value|initial|inherit;

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

মান বর্ণনা
0 স্ক্রোল বাহ্যিক মার্জিনের ডানদিকের 0। ডিফল্ট মান。
length

px, pt, cm প্রভৃতি ইউনিটে স্ক্রোল বাহ্যিক মার্জিনের ডানদিকের মান নির্দেশ করুন। নেতিবাচক মানও ব্যবহার করা যায়。

দেখুন:CSS ইউনিট

initial এই বৈশিষ্ট্যটি তার ডিফল্ট মানে নিয়ে যায়। দেখুন: initial
inherit এই বৈশিষ্ট্যটি তার পিতৃত্বভূত উপাদান থেকে উত্তরাধিকার নেয়। দেখুন: inherit

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

ডিফল্ট মান: 0
বংশীয়তা: না
অ্যানিমেশন নির্মাণ: সমর্থিত নয়। দেখুন:অ্যানিমেশন-সংক্রান্ত বৈশিষ্ট্য
সংস্করণ: CSS3
JavaScript সুত্র object.style.scrollMarginLeft="20px"

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

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

Chrome Edge Firefox Safari Opera
69.0 79.0 68.0 14.1 56.0

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

সূত্র:CSS ডাইরেকশন এট্রিবিউট

সূত্র:CSS scroll-snap-align অপারেশন

সূত্র:CSS scroll-snap-type অপারেশন

সূত্র:CSS writing-mode অপারেশন