البرمجة

إخفاء عمود في Bootstrap Table

08/03/2024
5 دقيقة واحدة

يبدو أنك تستخدم Bootstrap Table وتحتاج إلى إخفاء عمود معين في عرض الهواتف المحمولة. في الواقع، يمكنك تحقيق ذلك باستخدام بعض الشفرة CSS. يمكنك استخدام ميزة العناصر الوسيطة لتحقيق هذا الغرض. إليك كيف يمكنك القيام بذلك:

  1. أولاً، أعطي عمود الفحص ID أو كلاسًا لاستهدافه بسهولة. لنفترض أن لديك عمودًا بعنوان “checkbox_column”، يمكنك إعطاؤه كلاسًا مثل “checkbox-column”.

  2. ثم، استخدم وسائط CSS لإخفاء العمود في عرض الهاتف المحمول. يمكنك استخدام وسائط الإعلانات في CSS لتحقيق ذلك، حيث تكون الشاشات ذات عرض أصغر من 768 بكسل عادة ما تكون عروض الهواتف المحمولة.

إليك كيف يمكن تنفيذ الخطوات السابقة في CSS:

css
/* إخفاء عمود الفحص في عرض الهواتف المحمولة */
@media (max-width: 767px) {
  .checkbox-column {
    display: none;
  }
}

قم بوضع هذا الكود في جزء