web-dev-qa-db-fra.com

Que représente le `p-N` et ses variantes dans Bootstrap v4?

Je trouve la dénomination dans Bootstrap v4 moins qu'intuitive.

Je sais qu'ils veulent minimiser l'impact de toutes les classes encombrant le balisage, mais je ne peux tout simplement pas arriver à une conclusion raisonnable. Je peux deviner - mais je ne trouve pas de réponses concrètes.

  • p-1, p-2, p-N: Flexbox lié, mais que signifie p?
  • d-flex: Flexbox lié, mais que signifie d? Peut-être display?
  • mr-auto - Cousin des Elliots? Deviner la marge liée - peut-être margin-right-auto mais ne peut pas confirmer dans les documents.
  • mt-auto -?
  • ml-auto -?
csstwitter-bootstrapbootstrap-4twitter-bootstrap-4
22
Chris

Ce sont les nouvelles classes tilitaire d'espacement . Je pense qu'ils sont très intuitifs ...

  • p-* sert à rembourrer tous les côtés.
  • m-* est pour la marge tous les côtés.
  • pl-* est pour le remplissage à gauche.
  • mt-* est pour la marge supérieure.
  • mr-auto correspond à la marge droite automatique.

Démo Spacing Utils

Il y a aussi afficher les utilitaires ..

d-block, d-flex, d-inline-block, d-none etc..

26
Zim