Comment augmenter la taille de police dans Bootstrap 4 ?

Question

Dans Bootstrap 4, la taille de la police par défaut utilise em ou rem pour les polices.

Comment puis-je augmenter la taille de police pour toutes les tailles d'affichage ? Parce que chaque élément semble minuscule.

Answer 1

Parce que Bootstrap 4 utilise rem pour l'unité de font-size de la plupart de ses éléments, vous pouvez définir la valeur de font-size en px sur l'élément HTML de votre feuille de style personnelle, ce qui modifiera la taille par défaut appliquée par Bootstrap à vos éléments. J'ai inclus un lien vers un projet codeply, pour que vous puissiez le voir en action. L'environnement a déjà Bootstrap 4 chargé. Si vous modifiez la valeur du font-size pour le sélecteur html et que vous lancez le projet, vous pouvez voir comment la taille des éléments change par rapport à l'élément racine.

Ajouter trois lignes de CSS à votre feuille de style devrait être assez facile:

html {
    font-size: 16px;
}

Answer 2

Vous pouvez utiliser les classes bootstrap .h1 à .h6 ou créer votre propre classe CSS personnalisée pour définir la taille de police ici et appliquer votre classe à votre élément HTML.

Answer 3

Bootstrap 4: Il existe une gamme de classes que vous pouvez utiliser pour personnaliser votre texte :

• h1 - h6
• display-1 - display-4
• small

Par exemple :

  Prénom : {{selected_customer.first_name}}
  Nom : {{selected_customer.last_name}}

Answer 4

Vous voudrez peut-être également envisager d'ajouter ceci :

Lorsque j'ai ajouté ceci, les tailles de texte sur mes navigateurs mobiles sont devenues soudainement raisonnables.