ändern Sie die Grenzen Farbe und Teiler Element Farbe in ionic

Question

Ich benutze ionische und ich muss einige Stile in meinem Projekt ändern. vor allem muß ich die Grenzen Liste rot und den Hintergrund für Teiler Artikel

dies der Code für die ist „auf dem Bild, was ich brauche, zu verstehen suchen“ zu werden, die Farbe ändern
Vorlagenseite

<ion-view title="Home"> 
<ion-content scroll="true" class="padding has-header"> 
    <form class="list"> 
     <label class="item item-select" name="choose your category"> 
      <span class="input-label">choose your category</span> 
      <select></select> 
     </label> 
    </form> 
    <ion-list> 
     <ion-item class="item-divider">Unreturned stuff</ion-item> 
     <ion-item class="item-thumbnail-left"> 
      <img> 
      <h2>Title</h2> 
      <p>Item</p> 
     </ion-item> 
     <ion-item class="item-divider">Limited stuff</ion-item> 
     <ion-item class="item-thumbnail-left"> 
      <img> 
      <h2>Title</h2> 
      <p>Item</p> 
     </ion-item> 
     <ion-item class="item-divider">Skills</ion-item> 
     <ion-item class="item-thumbnail-left"> 
      <img> 
      <h2>Title</h2> 
      <p>Item</p> 
     </ion-item> 
    </ion-list> 
</ion-content> 

Answer 1

können Sie die c ändern olor der Grenze der Liste durch zwingende die folgenden Klassen:

.item, .item-divider { 
    border-color: red; 
} 

ist jedoch zu beachten, dass dies sowohl die Grenzen der Elemente ändern und den Teilern und wird nicht genau das erreichen, was Sie beschreiben. Wenn Sie möchten, dass einige der Rahmen grau bleiben, müssen Sie die einzelnen Abschnitte der Rahmen separat unter Verwendung von border-bottom, border-left, border-right und formatieren.

---

Um den Hintergrund der Teiler ändern die Standardfarben von Ionic verwenden, müssen Sie Folgendes hinzufügen:

<ion-item class="item-divider positive-bg light">Unreturned stuff</ion-item> 

Dies fügt einen blauen (positiv) Hintergrund mit weißen (hell) Text der Teiler, jedoch würde ich empfehlen, eine benutzerdefinierte CSS-Klasse zu schaffen, die eine background-color und color, wie so setzt:

.custom-class-divider { 
    color: [something]; 
    background-color: [something else] 
}