界面样式

发布时间 2018-11-23 9:10:25 浏览量() 收藏(1)

一、主题（解决标题不居中的问题）

imports: [
BrowserModule,
IonicModule.forRoot(MyApp,{
iconMode:'ios',
modalEnter:'modal-slide-in',
modalLeave:'modal-slide-out',
tabsHideOnSubPages:'true',//影藏所有子页面
backButtonText:'',
mode:'ios'
}),

主题样式

$colors: (
  primary:    #488aff,  //蓝色
  secondary:  #32db64,
  danger:     #f53d3d,  //玫红
  light:      #f4f4f4,
  dark:       #222);
  
  style="opacity: 0.8;height:5%" no-border-bottom color="primary"

箭头在后面

<ion-icon name="ios-arrow-forward-outline" item-end></ion-icon>

if语句的用法

<ion-icon  *ngIf="three; else elseBlock"  name="ios-arrow-up-outline"></ion-icon>
<ng-template #elseBlock>
<ion-icon  name="ios-arrow-down"></ion-icon> &nbsp;&nbsp;&nbsp;
</ng-template>

<ion-footer *ngIf="iforder" keyboard-attach>
<div fixed style="height:43px">
<ion-input type="text" placeholder="请输入意见" #suggestion style="float:left;width:80%;height:100%"></ion-input>
<button style="float:right;width:20%;height:100%;background-color:#488aff;color:white" (click)="suggset(suggestion)">发送</button>
</div>
</ion-footer>

如果想隐藏系统自带返回按钮：hideBackButton="true"

ion-navbar hideBackButton="true" style="opacity: 0.8;height:5%" no-border-bottom color="danger">

广告会让浏览体验不好，可这是网站的唯一收入，请点击下面的百度广告，支持老高的开源行动吧！