Comment puis-je changer la couleur de l'ion-titre?
J'ai essayer de changer la couleur de l'ion-titre dans ionique 2.
J'ai le code suivant:
<ion-header>
<ion-navbar>
<ion-title primary>Title</ion-title>
</ion-navbar>
</ion-header>
La couleur de la ion-title
ne changent pas. J'ai essayer plusieurs choses comme:
<ion-title color="primary">Title</ion-title>
<ion-title>
<p primary>Title</p>
</ion-title>
Avec le deuxième, j'ai le titre dans la bonne couleur, mais l'en-tête est grosse. J'ai donc ajouter ceci dans les variables.scss:
$toolbar-ios-height: 5rem; //ios
$toolbar-md-height: 5rem; //android
Mais rien ne change.Quelqu'un aurait-il une solution? Ou dois-je utiliser le p
ou h
balise pour changer la couleur?
- Êtes-vous un test sur un appareil mobile ? Si oui, avez-vous reconstruisez votre projet avant de l'exécuter ? Ou êtes-vous à l'aide de
ionic serve
? Essayez de travailler avecCache Disable
sur votre navigateur option. - J'ai essayer sur l'aperçu, le périphérique et l'émulateur. L' $barre d'outils fonctionne, je l'ai essayer, mais pas avec le p ou h balise. Seulement quand j'ai des ions titre
- avez-vous besoin d'un changement global ou pour une page?
Vous devez vous connecter pour publier un commentaire.
Supprimer la
color="..."
de laion-title
élément et utiliser ce sass variables dans votrevariables.scss
fichier:Si vous souhaitez utiliser une des couleurs inclus dans le nom d'une couleur variables
Vous pouvez le faire en utilisant
map-get
comme ceci:Remarque:
Réglage de la couleur avec juste la
color
attribut est obsolète depuis la version 3.0.0 de Ionique plus d'infos.Mise à jour:
Vous pouvez ajouter cette règle de style dans le
app.scss
fichier (global) et il ne fera que changer le titre et rien d'autre:.toolbar-title.toolbar-title-md, .toolbar-title.toolbar-title-ios, .toolbar-title.toolbar-title-wp { color: map-get($colors, custom); }
Je sais que cette question a été répondu, mais une autre façon de définir la couleur du texte dans le titre est dans les variables.scss fichier,
de base sera de la couleur de fond et le contraste sera votre texte/icône de couleur