CSS scroll-padding-block-end অপারেটর
- পূর্ববর্তী পৃষ্ঠা scroll-padding-block
- পরবর্তী পৃষ্ঠা scroll-padding-block-start
定义和用法
scroll-padding-block-end
属性指定在块方向上,从容器末端到子元素吸附位置的距离。
这意味着,当你停止滚动时,滚动将快速调整,并在块方向上,于吸附位置和容器之间指定的距离处停止。
ব্লক দিশা বর্তমান লাইনের সমুহ্যের সমুহ্যের অবস্থান থেকে, পরবর্তী লাইনটি যেভাবে স্থাপন করা হয় তাকে বোঝায়। এটি CSS display: block; এর সঙ্গে সম্পর্কিত ট্যাগ (যেমন <p> এবং <div> ট্যাগ) পৃষ্ঠার সাথে কিভাবে সাজানো হয় তারও সমূহ্য। ব্লক দিশা লিপিভাষ অনুযায়ী নির্ধারিত হয়, যেমন, মঙ্গোলীয় ভাষার নতুন লাইন বাম থেকে ডানের দিকে সাজানো হয়, তাই ব্লক দিশা বাম থেকে ডানের দিকে, ইংরেজি পৃষ্ঠার ব্লক দিশা নিচের দিকে। ব্লক দিশা CSS প্রতিভূতির মাধ্যমে নির্ধারিত করা যেতে পারে writing-mode
来定义。
吸附位置是指当你停止滚动时,子元素在容器中吸附到位的位置。
注意:নোট: যখন সাবইলেক্টের ওপর scroll-snap-align গুণটি নির্দেশ করা হয়
গুণটি ব্লক দিকের
গুণটি 'end'-এ ন্যায়ায়িত হলেই কাজ করবে scroll-padding-block-end
দেখার জন্য যখন সাবইলেক্টের ওপর scroll-snap-align গুণটি নির্দেশ করা হয়
গুণ, এবং পিতৃ ইলেক্ট্রনের ওপর scroll-snap-align গুণটি নির্দেশ করুন scroll-padding-block-end
ও scroll-snap-type
গুণ
উদাহরণ
উদাহরণ 1
কনটেনারের শেষ থেকে স্ন্যাপ স্থানের ব্লক দিকের স্ক্রোল আইন্দ্রিয় সুদূরতা 20px নির্দেশ করুন:
div { scroll-padding-block-end: 20px; }
উদাহরণ 2: ছবি সংগ্রহ
স্ন্যাপ আচরণসম্পন্ন ছবি গ্যালারিতে, scroll-padding-block-end
গুণটি ছবিটিকে স্থায়ী ইলেক্ট্রনের ওপরে উঠে দেয়া হবে:
#container { scroll-padding-block-end: 30px; }
উদাহরণ 3
যখন কনটেনার ইলেক্ট্রনের writing-mode
গুণ মানটিকে vertical-rl-এ ন্যায়ায়িত করার ক্ষেত্রে, ব্লক দিকের কনটেনারের শেষ ও সাবইলেক্টগুলি তালু থেকে বামে সরে যাবে। এটি স্ক্রোল স্ন্যাপ আচরণ ও scroll-padding-block-end
গুণটির কাজকর্ম:
#container { scroll-padding-block-end: 20px; writing-mode: vertical-rl; }
CSS গঠনশৈলী
scroll-padding-block-end: auto|value|initial|inherit;
গুণ মান
মান | বর্ণনা |
---|---|
auto | ডিফল্ট মান |
length |
px, pt, cm ইত্যাদি ইউনিটে scroll-padding-block-end নির্দেশ করুন。 নেতিবাচক মান ব্যবহার করা না হবে। দেখুন:CSS ইউনিট。 |
% | অন্তর্নিহিত ইলেক্ট্রনের প্রস্থ প্রতিশতে আইন্দ্রিয় সুদূরতা নির্দেশ করুন。 |
initial | এই গুণটিকে তার ডিফল্ট মানে ন্যায়ায়িত করুন। দেখুন initial。 |
inherit | এই গুণটি পিতৃ ইলেক্ট্রনের থেকে উত্তরসূরী করে। দেখুন inherit。 |
টেকনিক্যাল বিবরণ
ডিফল্ট মান: | auto |
---|---|
পুনর্বিন্যসনযোগ্যতা: | না |
অ্যানিমেশন নির্মাণ: | সমর্থন নেই। দেখুন:অ্যানিমেশন-সংক্রান্ত গুণ。 |
সংস্করণ: | CSS3 |
জেভাস্ক্রিপ্ট গঠনশৈলী: | object.style.scrollPaddingBlockEnd="20px" |
ব্রাউজার সমর্থন
টেবিলের সংখ্যা এটি প্রথমবার এই লক্ষ্য সম্পন্ন করা ব্রাউজারের সংস্করণকে নির্দেশ করে。
চ্রোম | এজ | ফায়ারফক্স | সাফারি | অপেরা |
---|---|---|---|---|
69.0 | 79.0 | 68.0 | 15.0 | 56.0 |
সংশ্লিষ্ট পৃষ্ঠা
উল্লেখ:CSS scroll-snap-align অপারেটর
উল্লেখ:CSS scroll-snap-type অপারেটর
উল্লেখ:CSS writing-mode অপারেশন
- পূর্ববর্তী পৃষ্ঠা scroll-padding-block
- পরবর্তী পৃষ্ঠা scroll-padding-block-start