s202226701018/wisdom-app/src/app/component/navigation-lan/navigation-lan.component.html

<ion-card>
  <ion-card-header>
    <ion-card-title>
      <ion-segment [scrollable]="true" value="hotdot" [value]="type" (ionChange)="typeChange($event)">
        <ion-segment-button value="hotdot" content-id="hotdot">
          <ion-label>热点</ion-label>
        </ion-segment-button>
        <ion-segment-button value="export" content-id="export">
          <ion-label>专家科普</ion-label>
        </ion-segment-button>
        <ion-segment-button value="sleep" content-id="sleep">
          <ion-label>睡眠</ion-label>
        </ion-segment-button>
        <ion-segment-button value="life" content-id="life">
          <ion-label>生活</ion-label>
        </ion-segment-button>
        <ion-segment-button value="male" content-id="male">
          <ion-label>男性</ion-label>
        </ion-segment-button>
        <ion-segment-button value="female" content-id="female">
          <ion-label>女性</ion-label>
        </ion-segment-button>
      </ion-segment>
    </ion-card-title>
    <!-- <ion-card-subtitle>请输入账号密码</ion-card-subtitle> -->
  </ion-card-header>

  <ion-card-content>
    <ion-segment-view>
      <ion-segment-content id="hotdot">First</ion-segment-content>
      <ion-segment-content id="export">Second</ion-segment-content>
      <ion-segment-content id="sleep">Third</ion-segment-content>
      <ion-segment-content id="sleep">life</ion-segment-content>
      <ion-segment-content id="sleep">male</ion-segment-content>
      <ion-segment-content id="sleep">female</ion-segment-content>
    </ion-segment-view>
  </ion-card-content>
</ion-card>