Mga utility para sa layout

Para sa mas mabilis na mobile-friendly at tumutugon na pag-unlad, ang Bootstrap ay may kasamang dose-dosenang mga klase ng utility para sa pagpapakita, pagtatago, pag-align, at paglalagay ng espasyo ng nilalaman.

Nagbabagodisplay

Gamitin ang aming mga display utilities para sa tumutugon na pag-toggle ng mga karaniwang value ng displayproperty. Ihalo ito sa aming grid system, nilalaman, o mga bahagi upang ipakita o itago ang mga ito sa mga partikular na viewport.

Mga pagpipilian sa Flexbox

Ang Bootstrap 4 ay binuo gamit ang flexbox, ngunit hindi lahat ng elemento displayay nabago sa display: flexdahil ito ay magdaragdag ng maraming hindi kinakailangang pag-override at hindi inaasahang magbabago ng mga pangunahing gawi ng browser. Karamihan sa aming mga bahagi ay binuo gamit ang flexbox na pinagana.

Kung kailangan mong magdagdag display: flexsa isang elemento, gawin ito gamit ang .d-flexo isa sa mga tumutugong variant (hal, .d-sm-flex). Kakailanganin mo ang klase o displayvalue na ito upang payagan ang paggamit ng aming mga karagdagang flexbox utility para sa sizing, alignment, spacing, at higit pa.

Margin at padding

Gamitin ang marginat padding spacing utilities upang kontrolin kung paano ang mga elemento at bahagi ay may pagitan at laki. Kasama sa Bootstrap 4 ang limang antas na sukat para sa mga kagamitan sa pagpupuwang, batay sa isang 1remdefault na $spacervariable ng halaga. Pumili ng mga halaga para sa lahat ng viewport (hal, .mr-3para sa margin-right: 1rem), o pumili ng mga tumutugong variant upang i-target ang mga partikular na viewport (hal, .mr-md-3para sa margin-right: 1remsimula sa mdbreakpoint).

I-togglevisibility

Kapag displayhindi kailangan ang pag-toggle, maaari mong i-toggle ang visibilityisang elemento gamit ang aming mga visibility utility . Ang mga hindi nakikitang elemento ay makakaapekto pa rin sa layout ng pahina, ngunit biswal na nakatago mula sa mga bisita.