changer la police la taille des ions de l'étiquette dans une page unique Ionique

Je veux changer la taille de police d'un ion-étiquette sur la page d'accueil d'un ioniques app.
J'ai lu que je peux changer la taille de la police des variables dans l' __variables.scss fichier, ce qui pourrait affecter les ions de l'étiquette. Je pense que je pourrais le faire.
Mais je trouve ça étrange que ça ne fonctionne pas pour le style de l'ion-label dans le fichier scss associé à la page. J'ai chercher sur internet mais je ne pouvais pas trouver quoi que ce soit, autre que mon approche devrait fonctionner.

C'est mon scss:

$primary-color: #cf810c;
$bg-color: #CCFFFF;

page-home {
    .masters{
        background-color:$bg-color;
    }
    ion-label{
        color: $primary-color;
        font-size: 4em;
   }
}

Et c'est le contenu de mon fichier html:

<ion-content padding class="masters">
  <ion-label stacked>Tap and press the buttons to win!</ion-label>
</ion-content>

Ma page se présente comme suit:

changer la police la taille des ions de l'étiquette dans une page unique Ionique

InformationsquelleAutor Ileana Profeanu | 2017-11-22
  1. 5

    Vous avez juste besoin de faire comme ceci:

    Ce travail est stackblitz

    my-page.html

      <ion-label stacked class="my-label">Tap and press the buttons to win!</ion-label>

    ma-page.scss

    .my-label {
  font-size: 4em;
}
    • Donc je suppose qu'il n'y a pas d'autre moyen.. merci
    InformationsquelleAutor Sampath
  2. 1

    Vous pouvez ajouter une classe à votre étiquette et le modifier dans le CSS.

    Html

    <ion-label class="testclass">Your Label</ion-label>

    CSS

    .testclass{ font-size: 30px !important; }

    InformationsquelleAutor Shahab Rauf
  3. 1

    Désolé, mais les réponses de Sampath et Shahab Rauf ne fonctionne pas pour moi: Ionique 4 et angulaire 5.

    Ci-dessous une autre proposition:

    HTML:

      <ion-label stacked >
      <p class="my-label">Tap and press the buttons to win!</p>
  </ion-label>

    SCSS:

    page-my-page {
    .my-label {
        font-size: 8em;
      }
}

    Ici, pas nécessaire d'ajouter le fichier SCSS en styleUrls attribut de la composante Angulaire ou en app.scss.

    Espère qu'elle pourra vous aider.

    InformationsquelleAutor olivier cherrier
  4. 1

    Je déconseille d'utiliser les polices de caractères-les valeurs de la taille/classes, comme dans les autres réponses. Ioniques ont une taille de police, qui s'adapte aux régimes à h1, h2, ..., petit et d'autres balises; voir ici: https://github.com/ionic-team/ionic/blob/master/core/src/css/typography.scss#L34

    Je vous suggère juste envelopper l'une de ces balises avec <ion-label> afin d'harmoniser la police-les valeurs de l'ensemble de votre application:

    <ion-item
    <ion-label>
        <small>Foo Bar</small>
    </ion-label>
</ion-item>
    InformationsquelleAutor Phil