Βοηθητικά προγράμματα για διάταξη

Αλλαγήdisplay

Χρησιμοποιήστε τα βοηθητικά προγράμματα εμφάνισης για την απόκριση εναλλαγή κοινών τιμών της displayιδιοκτησίας. Συνδυάστε το με το σύστημα πλέγματος, το περιεχόμενο ή τα στοιχεία μας για να τα εμφανίσετε ή να τα αποκρύψετε σε συγκεκριμένες θύρες προβολής.

Επιλογές Flexbox

Το Bootstrap είναι κατασκευασμένο με flexbox, αλλά δεν displayέχουν αλλάξει όλα τα στοιχεία σε, display: flexκαθώς αυτό θα πρόσθετε πολλές περιττές παρακάμψεις και θα άλλαζε απροσδόκητα τις βασικές συμπεριφορές του προγράμματος περιήγησης. Τα περισσότερα από τα εξαρτήματά μας είναι κατασκευασμένα με ενεργοποιημένο το flexbox.

Εάν χρειαστεί να προσθέσετε display: flexσε ένα στοιχείο, κάντε το με .d-flexή μία από τις αποκριτικές παραλλαγές (π.χ., .d-sm-flex). Θα χρειαστείτε αυτήν την κλάση ή displayτην τιμή για να επιτρέψετε τη χρήση των επιπλέον βοηθητικών προγραμμάτων flexbox για το μέγεθος, την ευθυγράμμιση, την απόσταση και άλλα.

Περιθώριο και επένδυση

Χρησιμοποιήστε τα βοηθητικά προγράμματαmargin και Spacing για να ελέγξετε τον τρόπο με τον οποίο τα στοιχεία και τα στοιχεία είναι τοποθετημένα σε απόσταση και μεγέθη. Το Bootstrap περιλαμβάνει μια κλίμακα έξι επιπέδων για βοηθητικά προγράμματα απόστασης, με βάση μια προεπιλεγμένη μεταβλητή τιμής. Επιλέξτε τιμές για όλες τις θύρες προβολής (π.χ. για στο LTR) ή επιλέξτε παραλλαγές που αποκρίνονται για να στοχεύσετε συγκεκριμένες θύρες προβολής (π.χ. για —στο LTR— ξεκινώντας από το σημείο διακοπής).padding 1rem$spacer.me-3margin-right: 1rem.me-md-3margin-right: 1remmd

Μεταβάλλωvisibility

Όταν displayδεν απαιτείται εναλλαγή, μπορείτε να αλλάξετε την εναλλαγή visibilityενός στοιχείου με τα βοηθητικά προγράμματα ορατότητας . Τα αόρατα στοιχεία θα εξακολουθούν να επηρεάζουν τη διάταξη της σελίδας, αλλά είναι οπτικά κρυμμένα από τους επισκέπτες.