css - 编辑 Ionic 选项卡图标样式

Question

我正在开发一个主要导航方法是选项卡的 Ionic 元素。中心选项卡需要突出显示，所以我在 scss 中创建了这样的样式:

i.icon.ion-ios-camera {
    height: inherit;
    border-radius: 100em;
    background-color: #ff5b38;
}

我这样做的方式与我在 ionic serve 时做烧烤的方式相同。 'ing 和检查，我发现我的标签:

<ion-tab title="Post" icon="ion-ios-camera" href="#/home/post">
    <ion-nav-view name="tab6"></ion-nav-view>
</ion-tab> 

编译为:

所以我只想为编译后的图标创建一个样式(我只想为选项卡图标设置样式，而不是为整个选项卡设置样式)。奇怪的是，这不起作用。但是，检查该元素并添加这样的样式是可行的:

最终结果应该是这样的:

但我只能直接编辑<i>来实现那些样式在检查器中标记。我上面发布的样式(在 ionic.app.scss 文件中)不会修改图标样式。难道我做错了什么？我的样式是否未正确编译？

Answer 1

经过大量研究，我找到了实际的解决方案，只需添加您的风格

对于安卓:

如果您更改 Inactive 图标，则更新为 false。

.tabs-md .tab-button[aria-selected=true] .tab-button-icon {
  color: 'my-brand-color';
}