কম্পিউটার

CSS এর সাথে স্ক্রোল অ্যাঙ্করিং অক্ষম করা হচ্ছে


ওয়েব ব্রাউজার দ্বারা প্রদত্ত ডিফল্ট স্ক্রোল অ্যাঙ্করিং অক্ষম করতে, আমরা ওভারফ্লাঞ্চর ব্যবহার করতে পারি সম্পত্তি।

উদাহরণ

নিচের উদাহরণটি ওভারফ্লো-অ্যাঙ্কর প্রপার্টি -

সম্পর্কে ধারণা দেয়
<!DOCTYPE html>
<html>
<head>
<style>
body {
   overflow-anchor: none;
}
div{
   display: flex;
   flex-direction: row;
}
</style>
</head>
<body>
<div><img src="https://images.unsplash.com/photo-1613061588991-
6dd130548bc7?crop=entropy&cs=tinysrgb&fit=crop&fm=jpg&h=400&ixlib=rb1.2.1&q=80&w=160" />
<img src="https://images.unsplash.com/photo-1612129717112-
9d1274034547?crop=entropy&cs=tinysrgb&fit=crop&fm=jpg&h=400&ixlib=rb1.2.1&q=80&w=160" />
<img src="https://images.unsplash.com/photo-1613079936591-
8ce270890241?crop=entropy&cs=tinysrgb&fit=crop&fm=jpg&h=400&ixlib=rb1.2.1&q=80&w=160" />
<img src="https://images.unsplash.com/photo-1612454902143-
328050834c9e?crop=entropy&cs=tinysrgb&fit=crop&fm=jpg&h=400&ixlib=rb1.2.1&q=80&w=160" />
</div>
<h2>Test overflow</h2>
</body>
</html>

আউটপুট

এটি নিম্নলিখিত ফলাফল তৈরি করবে -

CSS এর সাথে স্ক্রোল অ্যাঙ্করিং অক্ষম করা হচ্ছে


  1. সিএসএস এবং জাভাস্ক্রিপ্ট দিয়ে স্ক্রলে একটি শিরোনাম কীভাবে সঙ্কুচিত করবেন?

  2. CSS-এ স্ক্রলে ফিক্সড হেডার সহ HTML টেবিল

  3. CSS-এ অবজেক্ট-ফিট এবং অবজেক্ট-পজিশন সহ ছবি ক্রপ করুন

  4. কিভাবে CSS দিয়ে একটি অন স্ক্রোল ফিক্সড নেভিগেশন বার তৈরি করবেন?