代码之家 › 专栏 › 技术社区 › Ali Abdulaal

如何在ionic中更改tabsHighlight的颜色

highlight ionic3 tabs colors html

Ali Abdulaal · 技术社区 · 8 年前

我有一个iontabs,我想在它激活时更改突出显示

以下是html的代码:

<ion-tabs mode="md" tabsPlacement="top" tabsHighlight="true" tabsLayout="icon-start">
    <ion-tab [root]="tab1Root" tabBadge="" tabBadgeStyle="" tabTitle="TODAY" tabIcon="ios-star" ></ion-tab>
</ion-tabs>

这里是我的css代码(我只能更改文本和图标颜色):

$tabs-md-tab-text-color-active: #000;
$tabs-md-tab-icon-color-active: #000;
$tabs-md-tab-highlight-color-active: #000;

2 回复 | 直到 8 年前

Mystery 8 年前

不幸的是,为tab highlight(从 https://ionicframework.com/docs/theming/overriding-ionic-variables/ )不工作。

这里还有一个关于更改活动选项卡背景颜色的线程: https://forum.ionicframework.com/t/changing-tab-color-in-ionic/39457/15

您可以将其添加到应用程序中。改为SCS

.tabs-md .tab-button[aria-selected=true] {
  background: #000;
}

Krishan 8 年前

可以使用Sass变量更改选项卡颜色。有关主题设置的示例,请参见会议应用程序:

https://github.com/driftyco/ionic-conference-app/tree/master/src/theme

推荐文章

josh · 突出显示最接近目标值的单元格,但忽略文本

1 年前

hbstha123 · 如果某个值在任意两行的列中匹配,我希望使用VBA仅突出显示Excel中第二行中的值。怎样

2 年前

Melissa Arroyo-Mendoza · 如何根据不同数据帧中列的值突出显示一个数据帧中的行或字符串?

2 年前

Ice Bear · Safari搜索栏突出显示红色文本

2 年前

sifar · 自动选择并突出显示应用程序中选定文件夹中的所有文件。FileDialog(msoFileDialogFilePicker)

2 年前

Sebastiaan · Visual Studio代码删除标记突出显示

8 年前

NIKHIL AWARI · 在url中提供id时如何突出显示div

8 年前

Rat Kabu · @laravel上的产量(“内容”)不仅仅适用于纯白色文本

8 年前

Ashley Thomson · 高亮显示数值连续3次相同的单元格

9 年前