這一講主要包含以下幾個(gè)部分
- 1.配置APP主色調(diào)儒旬；
- 2.設(shè)置ion-content組建的fullscreen屬性帖族；
- 3.設(shè)計(jì)透明導(dǎo)航欄
配置APP主色調(diào)；
找到src/theme/variables.scss甚垦，修改$colors的primary顏色值：
variables.scss
$colors: (
primary: #f8285c,
secondary: #32db64,
danger: #f53d3d,
light: #f4f4f4,
dark: #222
);
2.設(shè)置ion-content組建的fullscreen屬性涣雕；
home.html
<ion-content fullscreen>
...
</ion-content>
* 3.設(shè)計(jì)透明導(dǎo)航欄
home.html
<ion-header>
<ion-navbar style="opacity: 0.8" no-border-bottom color="primary">
<ion-title>首頁</ion-title>
</ion-navbar>
</ion-header>
效果圖
5-1.gif
下一講將講解在ionic3中如何封裝通用組建挣郭。
完！
