Comment définir la couleur d'arrière-plan IONIQUE 4

Je avoir des problèmes en essayant de changer la couleur d'arrière-plan en une seule IONIQUE 4 (--type=angulaire) de la page. Je suis en train d'ajouter une classe pour les ions de contenu. Dans mon fichier html, j'Ai:

<ion-content class="fondologin">
...
</ion-content>

Dans mon sass j'ai:

.fondologin{
    background-color: #111D12!important;
}

La couleur d'arrière-plan n'est jamais modifié. Si j'ajoute --ion-background-color:#111D12; dans des variables.scss l'arrière-plan est modifié avec succès pour chaque page, mais je viens de changer la couleur d'une page. Comment puis-je y parvenir?

  • pourriez-vous essayer à l'aide de [ngClass] ou [classe] attribut et d'essayer?
  • Sont u à l'aide de ce à l'intérieur de l'app scss fichier?
  • avez-vous essayé cette ion-content{ --ion-background: #111D12 !important}
  • Je suis en train à l'intérieur de l'app scss ou à l'intérieur de mon composant sass, sans succès
InformationsquelleAutor Kevin Sanchez | 2018-11-29
  1. 38

    Pour une raison que je l'ai résolu de cette façon:

    Tout d'abord, j'ai ajouté --ion-background-color:#ffffff; dans le variables.scss fichier à l'intérieur dossier de thème.

    Dans ma Page scss j'ai écrit:

    ion-content{

    --ion-background-color:#111D12;
}

    Après que le fond a été réussie.

    • Vous n'avez pas besoin de l'ajouter à des variables.scss plus.
    InformationsquelleAutor Kevin Sanchez
  2. 9

    Je vais reposter le haut commenté réponse , avec en plus une explication

    ion-content{

    --ion-background-color:#111D12;
}

    À partir de ionique 4, Ionique composant implémente le concept de shadowDOM, et la vieille méthode qui consiste à trouver les sélecteurs css dans le composant qui implémente shadowDOM ne fonctionne plus

    En tant que tel, aucune modification ne peut être faite si vous modifiez la variable que les références de composants

    par exemple, si la teneur en ions références

    --ion-background-color: #ffffff

    La seule façon vous pouvez modifier la couleur d'arrière-plan est de faire cela dans votre fichier css

    ion-content{

    --ion-background-color:#111D12;
}
    InformationsquelleAutor Edward Choh
  3. 3

    Vous pouvez l'utiliser comme ça...bon travail sur ma page.

    ion-content{
    --background: #fff url('../../assets/imgs/intro.png') no-repeat center center /cover;
}

    J'espère que cela vous aide à vous 🙂

    InformationsquelleAutor user9088454
  4. 0

    Il pourrait être vous sélecteur CSS qui n'est pas assez précis.

    Essayez ceci :

    ion-content.fondologin{
    background-color: #111D12!important;
}

    Si cela ne fonctionne toujours pas, puis inspectez votre ionique de l'élément de contenu et essayer de trouver votre CSS, et dont la propriété ou d'autres sélecteur est primordial, il

    InformationsquelleAutor rguerin
  5. 0

    Essayez celui-ci: 

        :host {
      ion-content {
        ion-background-color: #d5ffd5;
      }
    }

//Or 

 page-name{
      ion-content {
        ion-background-color: #d5ffd5;
      }
    }
    • Il est recommandé d'ajouter des descriptions pour la réponse que vous avez posté
    InformationsquelleAutor Rahul Jograna
  6. 0

    Pour changer l'arrière-plan sur une seule page:

    ion-content{
--ion-background-color:  #00ABE1 !important;
}

    N'oubliez pas le !important ou il pourrait ne pas fonctionner.

    InformationsquelleAutor Ivo Nikolov
  7. 0

    De l'essayer. 

    ion-content{
background-color:  #000000(use your color here) !important;
}

    et laissez-moi savoir c'est de travailler pour vous ou pas

    InformationsquelleAutor Nayan Dubey