CSS scroll-margin-right প্রক্রিয়া

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

scroll-margin-right অ্যাট্রিবিউটটি স্থান সংযোজন এবং কনটেনারের মধ্যে দূরত্ব নির্দেশ করে।

স্থান সংযোজন হল যখন সাব-উপাদান স্ক্রোল থেকে থামলে, তার কনটেনারের মধ্যে স্থানীয় স্থান যা স্থায়ী হয় এবং অ্যাট্রিবিউট সেটিংকে direction অ্যাট্রিবিউটকে writing-mode প্রভাব

নোট:এই অ্যাট্রিবিউটটি শুধুমাত্র যখন স্থান সংযোজন সাব-উপাদানের ডানপাশে নিশ্চিত করা হয় তখন কার্যকরী হয়。

দেখার জন্য scroll-margin-right পূর্বপুরুষ উপাদানে নিশ্চিত করার জন্য scroll-margin-right অ্যাট্রিবিউটকে এবং অ্যাট্রিবিউটকে scroll-snap-type অ্যাট্রিবিউট

ইনস্ট্যান্স

উদাহরণ 1

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

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

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

উদাহরণ 2: ছবি সংগ্রহ

scroll-margin-right এই অ্যাট্রিবিউটটি স্থান সংযোজন কর্মকারী ছবি গ্যালারিতে ব্যবহার করা যেতে পারে। এখানে,scroll-margin-right ব্যবহারকারীকে জানান যে ডানপাশেও একটি ছবি আছে। প্রথম ছবিটি স্ক্রোল করে প্রভাব দেখুন:

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

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

উদাহরণ 3: স্থান সংযোজন

যাতে scroll-margin-right অ্যাট্রিবিউট কার্যকরী হলে, স্থান সংযোজন সাব-উপাদানের ডানপাশে নিশ্চিত করা উচিত। এই উদাহরণে,direction এই অ্যাট্রিবিউটটি সাব-উপাদানের ডানপাশের স্থান থেকে বামপাশে পরিবর্তন করে।এই কোডটি ব্যবহার করে:scroll-margin-right এই অ্যাট্রিবিউটটি আর কাজ করবে না:

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

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

CSS স্যাক্সান্স:

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

অ্যাট্রিবিউট মান

মান বর্ণনা
0 স্ক্রোল মার্গিন রাইট পাশ 0। ডিফল্ট মান。
length

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

দেখুন:CSS ইউনিট。
initial এই অ্যাট্রিবিউটকে তার ডিফল্ট মানে নিয়ে যান। দেখুন: initial。
inherit এই অ্যাট্রিবিউটটি তার পিতৃতৃতীয় উপাদান থেকে উত্তরসূরী করে। দেখুন: inherit。

টেকনিক্যাল বিবরণ

ডিফল্ট মান: 0
উত্তরসূরীতা: না
অ্যানিমেশন নির্মাণ: সমর্থন নেই। দেখুন:অ্যানিমেশন-সংক্রান্ত অ্যাট্রিবিউট。
সংস্করণ: CSS3
জেভাস্ক্রিপ্ট স্যাক্সান্স: object.style.scrollMarginRight="20px"

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

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

চ্রোম এজ ফায়ারফক্স স্যাফারি অপেরা
69.0 79.0 68.0 14.1 56.0

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

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

উল্লেখ:CSS scroll-snap-align প্রক্রিয়া

উল্লেখ:CSS scroll-snap-type প্রক্রিয়া

উল্লেখ:CSS writing-mode প্রতিযোগিতা