سيناقش هذا المنشور ماهية مساحات التوثيق وكيف يمكن إزالتها لعنصر div معين في Bootstrap.
ما هو Gutter Space في Bootstrap؟
المزاريب هي الفراغات أو الفجوات بين الأعمدة التي تنتجها الحشو الأفقي. يتم استخدامها لدعم محاذاة المحتوى المتجاوبة والمسافات في نظام شبكة Bootstrap.
تُظهر الصورة أدناه صفًا به حدود حمراء حوله. داخل الصف ، توجد ثلاثة عناصر div متساوية الحجم لأعمدة شبكة متساوية. على الرغم من تساوي الأعمدة ، لا تزال هناك مسافات هامشية بينهما:
كيفية إزالة مساحة التوثيق لعنصر div معين في Bootstrap؟
في Bootstrap ، فإن الفصل ' لا المزاريب 'للقضاء على فراغات الحضيض في أي div.
لهذا الغرض:
- أضف ' 'مع الفئة' الرئيسية- div '.
- بعد ذلك ، اضبط قسم الصف بإضافة '
'عنصر مع الفئة' صف '. نظرًا لأنه يتعين علينا إزالة المسافات من الصف ، حدد فئة ' لا المزاريب ' فى خلال ذلك.- لتقسيم صف الشبكة إلى ثلاثة أعمدة متساوية ، استخدم الفئة ' العمود 4 '.
- داخل حاوية '
' لكل عمود ، اضبط عناصر '' بالفئات ' العمود 1 '،' العمود 2 '، و ' العمود 3 '، على التوالى: < شعبة صف دراسي = 'main-div' >
< شعبة صف دراسي = 'صف بلا مزاريب' >
< شعبة صف دراسي = 'عمود -4' >
< شعبة صف دراسي = 'العمود -1' > < / شعبة >
< / شعبة >
< شعبة صف دراسي = 'عمود -4' >
< شعبة صف دراسي = 'العمود -2' > < / شعبة >
< / شعبة >
< شعبة صف دراسي = 'عمود -4' >
< شعبة صف دراسي = 'العمود -3' > < / شعبة >
< / شعبة >
< / شعبة >
< / شعبة >CSS
في قسم CSS ، تم تصميم الفئات المذكورة في صفحة HTML بخصائص تصميم متعددة.
طراز فئة 'main-div'
.main-div {
العرض : 600 بكسل ؛
الهامش: 50 بكسل تلقائي ؛
}ال ' .main-div 'للدخول إلى عنصر div ذي الفئة' الرئيسية- div '. يتم تطبيق الخصائص التالية على هذه الفئة:
- ' العرض 'عرض العنصر.
- ' حافة 'التباعد حول العنصر.
فئة 'الصف'
.صف {
الحدود : أحمر صلب 1 بكسل ؛
}التمهيد ' صف يضاف 'فئة مع' الحدود ' خاصية. سيؤدي هذا إلى التفاف صف الشبكة في عرض ونمط وحدود لون محددة.
الفئات الثلاث ' العمود 1 '،' العمود 2 '، و ' العمود 3 'يتم تعيين CSS' لون الخلفية ' و ' ارتفاع 'لجعلها بارزة.
فئة النمط 'العمود 1'
.عمود- واحد {
معرفتي- اللون : فيروز؛
ارتفاع : 200 بكسل ؛
}فئة النمط 'العمود 2'
.عمود- 2 {
معرفتي- اللون : البنفسجي؛
ارتفاع : 200 بكسل ؛
}فئة النمط 'العمود 3'
.عمود- 3 {
معرفتي- اللون : الأخضر الأصفر؛
ارتفاع : 200 بكسل ؛
}يمكن ملاحظة أن '
'الحاوية مع الفئة' صف 'تم ضبطه بنجاح بدون مسافة هامش هامش بينهما:
لقد علمنا كيفية إزالة مساحة الحضيض لعنصر div معين في Bootstrap.
استنتاج
لإزالة مسافات هامش التوثيق لعنصر div معين ، فإن الفئة ' لا المزاريب ' يمكن استعماله. لهذا الغرض ، أضف '
'جنبًا إلى جنب مع' الصف لا المزاريب ' صف دراسي. قدم هذا المنشور دليلاً شاملاً حول مساحات الحضيض وكيف يمكن التخلص منها في عنصر div معين في Bootstrap. - بعد ذلك ، اضبط قسم الصف بإضافة '