Ionic-v4 中的侧边菜单背景颜色 [英] Sidemenu background-color in Ionic-v4
本文介绍了Ionic-v4 中的侧边菜单背景颜色的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有一个 Ionic-v4-app,其侧边菜单结构如下:
I have a Ionic-v4-app with an side-menu structured like that:
<ion-app>
<ion-split-pane>
<ion-menu>
<ion-header>
<ion-toolbar>
</ion-toolbar>
</ion-header>
<ion-content>
<ion-list>
</ion-list>
</ion-content>
</ion-menu>
</ion-split-pane>
</ion-app>
现在我想要整个侧边菜单(标题、列表、内容、所有内容)的背景.
Now I want the have a background for the whole side-menu (header, list, content, everything).
但是我没有必要尝试,我不明白它是如何工作的.
But it is unnecessary what I try, I don’t get how it is working.
我尝试了 ion-menu
的背景颜色和 header
和 content
的透明背景,但还是不行.
I tried a background color for ion-menu
and transparent background for header
and content
, but also not working.
我知道我必须使用我必须使用像 --ion-background-color
这样的离子 css 变量,但是如何使用?
I know that i had to use i had to use ionic css variables like --ion-background-color
, but how?
推荐答案
我相信以下解决方案会对您有所帮助:-)
I believe below solution would help you :-)
ion-menu {
--ion-background-color: var(--ion-color-primary);
--ion-text-color: var(--ion-color-primary-contrast);
ion-toolbar {
--background: var(--ion-color-primary);
}
ion-list {/* optional, but it needs when you use gradient as a background color.*/
background: transparent;
}
}
这篇关于Ionic-v4 中的侧边菜单背景颜色的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文