ionic4中自定义主题的颜色

Posted johnjackson

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了ionic4中自定义主题的颜色相关的知识,希望对你有一定的参考价值。

ionic4的主题样式提供了一些主题样式,也可以自定义,比如可以修改主题样式的颜色,官方文档(https://ionicframework.com/docs/theming/colors)里说了怎么写CSS,但是没说写在哪个文件,我测了一下,应该是写在src/theme/variables.scss中,

官方提供的主题颜色生成器:https://ionicframework.com/docs/theming/color-generator,这个生成器,只能生成(修改)ionic自带的9个命名主题颜色。

要自己添加更多(命名主题)颜色 ,可以用这个文档下方的自定义颜色生成器:https://ionicframework.com/docs/theming/colors

所谓(命名)颜色主题,官方提供了9个默认的命名颜色主题。而每个命名颜色主题有相应6种状态,每个状态都要有相应的颜色值,比如primary这个主题,其对应6种状态:base、Base (rgb)、contrast、Contrast (rgb)、shade、 tint.

 

 

以上是关于ionic4中自定义主题的颜色的主要内容,如果未能解决你的问题,请参考以下文章

如何在 Android 应用中自定义顶部状态栏?

VS Code 自定义文件资源管理器窗口颜色主题

Angular 材质自定义组件主题

如何在 Drupal 8 中自定义/样式/主题自定义内容类型的输出?

如何使用 Storybook 6 在 Vuetify 中自定义主题?

如何在 Storybook 6.0 中自定义深色和浅色主题