স্ক্রোলবারটিকে লুকানো

CSS-এর মাধ্যমে স্ক্রোলবারটিকে লুকানো শিখুন

স্ক্রোলবারটিকে লুকানো

যেভাবে overflow: hidden;ব্যবহার করুন, যাতে একইসঙ্গে অনুভূমিক এবং ভিক্ষুক্ষ স্ক্রোলবারটিকে লুকানো যায়。

উদাহরণ

body {
  overflow: hidden; /* স্ক্রোলবারটিকে লুকানো */
}

আপনার নিজের হাতে চেষ্টা করুন

যদি শুধুমাত্র ভিক্ষুক্ষ স্ক্রোলবারটিকে লুকানো কিংবা শুধুমাত্র অনুভূমিক স্ক্রোলবারটিকে লুকানো করতে হয়, তবে overflow-y বা overflow-x:

উদাহরণ

body {
  overflow-y: hidden; /* ভিক্ষুক্ষ স্ক্রোলবারটিকে লুকানো */
  overflow-x: hidden; /* অনুভূমিক স্ক্রোলবারটিকে লুকানো */
}

আপনার নিজের হাতে চেষ্টা করুন

দৃষ্টি দিনoverflow:hidden স্ক্রোলবারটিকের কার্যকারিতা মুক্ত করবে। পাতার ভিতরে স্ক্রোল করা সম্ভব হবে না。

স্ক্রোলবারটিকে লুকানো কিন্তু কার্যকারিতা রাখতে রাখা

স্ক্রোলবারটিকে লুকানো কিন্তু এটি স্ক্রোল করা প্রয়োজনীয় থাকলে, নিচের কোডটি ব্যবহার করুন:

উদাহরণ

/* Chrome, Safari এবং Opera-র জন্য স্ক্রোলবারটিকে লুকানো */
.example::-webkit-scrollbar {
  display: none;
}
/* IE, Edge এবং Firefox-এর জন্য স্ক্রোলবারটিকে লুকানো */
.example {
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

আপনার নিজের হাতে চেষ্টা করুন

Webkit ব্রাউজার (যেমন Chrome, Safari এবং Opera) অস্তর্গত ::-webkit-scrollbar প্রত্যক্ষ ইমেজ, যা আমাদের করে ব্রাউজার স্ক্রোলবারের দৃশ্যকে পরিবর্তন করতে পারে। IE এবং Edge এটি সমর্থন করে -ms-overflow-style: প্রতিশতি, ফায়ারফক্স এটি সমর্থন করে scrollbar-width প্রতিশতি, যা আমাদের করে গুলোয়ান স্ক্রোলবারটিকে সংরক্ষণ করে এবং তার কার্যকারিতা রাখে

সংক্রান্ত পাতা

শিক্ষাকোষ:CSS 溢出

参考手册：CSS overflow প্রতিশব্দ