Bootstrap 4 Modifier Des Points D'Arrêt
J'ai une application dans laquelle la conception des appels pour une résolution de 1280 point d'arrêt de l'ordinateur de bureau pour tablette, ou, xl pour lg respectivement. Cependant, Bootstrap lui-même a le xl point d'arrêt à 1200.
J'ai besoin de le changer xl point d'arrêt à l'échelle mondiale pour bootstrap. Dois-je recompiler Bootstrap 4 à partir de la source des fichiers?
J'ai essayé de mettre ce paramètre à l'aide de mon Sass construire:
$grid-breakpoints: (
//Extra small screen /phone
xs: 0,
//Small screen /phone
sm: 576px,
//Medium screen /tablet
md: 768px,
//Large screen /desktop
lg: 992px,
//Extra large screen /wide desktop
xl: 1280px
);
$container-max-widths: (
sm: 540px,
md: 720px,
lg: 960px,
xl: 1220px
);
Cependant, rien n'a changé avec le point d'arrêt pour xl à l'échelle mondiale, il ne serait toujours faire la pause à la place à 1200px de large.
OriginalL'auteur smb | 2017-12-11
Vous devez vous connecter pour publier un commentaire.
La modification de la
$grid-breakpoints
variable fonctionnera très bien. N'oubliez pas que vous devez importer/bootstrap
ou labootstrap/variables
dans lecustom.scss
, et puis @import bootstrap après.Par exemple:
Démo: https://www.codeply.com/go/MlIRhbJYGj
Voir aussi: Comment étendre/modifier (personnaliser) Bootstrap 4 avec SASS
OriginalL'auteur Zim
Vous devez remplacer la
$grid-breakpoints
et$container-max-widths
variables. Voici un exemple de travail (scss):OriginalL'auteur kxxxxoo
En fonction de leur la documentation, dans le but de personnaliser Bootstrap, vous devez:
/scss/_variables.scss
à_custom.scss
que vous souhaitez modifier!default
de l'collé le code et modifier les valeurs de ce que vous vouleznpm run dist
à reconstruire à partir de la source.Vous n'êtes pas censé modifier quoi que ce soit à l'intérieur de
_variables.scss
que vous allez perdre ces changements lors de la mise à niveau de Bootstrap. Avec les étapes ci-dessus, vous pouvez en toute sécurité de la mise à niveau de Bootstrap et de garder vos mods.Remarque: Même si vous n'avez pas de soins sur la mise à niveau, et que vous souhaitez modifier directement dans
/scss/_variables.scss
, vous avez encore besoin de recompiler pour appliquer les modifications à votre/dist/
fichiers.OriginalL'auteur Andrei Gheorghiu