I need a help in ionic 3

Ionic Framework ionic-v3
1

I want to get the white background on the buttons, but I do not know how to do it.

Sem%20t%C3%ADtulo
Sem%20t%C3%ADtulo374×519 7.89 KB

html5

<!–

Generated template for the HomePage page.

See http://ionicframework.com/docs/components/#navigation for more info on

Ionic pages and navigation.

–>

<ion-header >

<ion-navbar color=“primary”>

<ion-buttons left>

<button ion-button icon-only menuToggle>

<ion-icon name=“menu”></ion-icon>

</button>

</ion-buttons>

<ion-title text-center *ngIf=“!IsSearchBarOpened”>

BibliCom

</ion-title>

<ion-searchbar *ngIf=“IsSearchBarOpened” ShowCancelButton=“true” (ionCancel)=“IsSearchBarOpened=false”></ion-searchbar>

<ion-buttons left>

<button ion-button icon-only *ngIf=“!IsSearchBarOpened” (click)="IsSearchBarOpened=true ">

<ion-icon name=“search”></ion-icon>

</button>

</ion-buttons>

</ion-navbar>

</ion-header>

<ion-content class=“bg”>

<ion-row >

<ion-item no-lines >

<ion-scroll scrollX=“true” scroll-avatar >

<button ion-button class=“scroll-item”>text</button>

<button ion-button class=“scroll-item”>text</button>

<button ion-button class=“scroll-item”>text</button>

<button ion-button class=“scroll-item”>text</button>

<button ion-button class=“scroll-item”>text</button>

<button ion-button class=“scroll-item”>text</button>

<button ion-button class=“scroll-item”>text</button>

<button ion-button class=“scroll-item”>text</button>

<button ion-button class=“scroll-item”>text</button>

</ion-scroll>

</ion-item>

</ion-row>

</ion-content>

css

page-home {
.bg {
background-image: linear-gradient(#38f9d7, #43e97b);
background-size: 100% 100%;
position: absolute;
display: block;
margin: 0;
}

ion-scroll[scrollX] {
white-space: nowrap;
height: 120px;
overflow: hidden;
color: transparent;

.scroll-item {
  display: inline-block;
}

.selectable-icon{
  margin: 10px 20px 10px 20px;
  color: red;
  font-size: 100px;
}

ion-avatar img{
  margin: 50px;
}

}

ion-scroll[scroll-avatar]{
height: 60px;
}

/* Hide ion-content scrollbar */
::-webkit-scrollbar{
display:none;
}
}

2

Comme indiqué dans la doc
https://ionicframework.com/docs/components/#buttons
Pour utiliser le style clair pour un bouton, ajoutez simplement la clear propriété:

<button ion-button color="light" clear>Light Clear</button>
<button ion-button clear>Primary Clear</button>
<button ion-button color="secondary" clear>Secondary Clear</button>
<button ion-button color="danger" clear>Danger Clear</button>
<button ion-button color="dark" clear>Dark Clear</button>