在 Ionic 2 中使用 <ion-segment> 时如何显示 shadow/border of <ion-navbar>

Question

作为标题，我想展示其中的 shadow/border 但我找不到解决方案。我使用了一些 css 代码但没有任何变化

这是我的HTML代码

<ion-header>
  <ion-navbar color="{{this.appService.appColor}}">
    <button ion-button menuToggle>
      <ion-icon name="menu"></ion-icon>
    </button>
    <ion-title>
      Feedbacks
    </ion-title>
  </ion-navbar>
  <ion-toolbar color="{{this.appService.appColorDark}}">
    <ion-segment [(ngModel)]="seg" color="{{this.appService.appStyle}}">
      <ion-segment-button value="users">
        <font color="white">Users Messages</font>
      </ion-segment-button>
      <ion-segment-button value="visitors">
        <font color="white">Visitor Messages</font>
      </ion-segment-button>
    </ion-segment>
  </ion-toolbar>
</ion-header>

HTML 输出：

需要输出：

Note: this picture has been drawn by windows paint. I uploaded to give you sample example for what I want.

Answer 1

我认为解决这个问题的最佳方案是用制表符替换段。

在 Ionic 2 中使用 <ion-segment> 时如何显示 shadow/border of <ion-navbar>

how to show shadow/border of <ion-navbar> when using <ion-segment> in Ionic 2

html

css

border

shadow

ionic2