ionic 4標簽顯示問題

Question

我在Ionic v4上的標簽有問題。 當我查看屏幕截圖時，您會看到怪異的外觀。

但是我的代碼只是從Ionic文檔復制而來的。 這是我的代碼

[![<ion-header>
  <ion-toolbar color="primary">
    <ion-title>
      Titel
    </ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>
  <ion-list>
    <ion-item>
      <ion-label>Default</ion-label>
      <ion-input></ion-input>
    </ion-item>
    <ion-item>
      <ion-label position="fixed">Fixed</ion-label>
      <ion-input></ion-input>
    </ion-item>
    <ion-item>
      <ion-label position="floating">Floating</ion-label>
      <ion-input></ion-input>
    </ion-item>
    <ion-item>
      <ion-label position="stacked">Stacked</ion-label>
      <ion-input></ion-input>
    </ion-item>
  </ion-list>
</ion-content>]

屏幕截圖

Answer 1

您可以嘗試刪除標簽，因為在他們的官方網站上他們沒有使用標簽來包裝元素。因此，您可以這樣嘗試-

 <!-- Inputs with labels --> <ion-item> <ion-label>Default Label</ion-label> <ion-input></ion-input> </ion-item> <ion-item> <ion-label position="floating">Floating Label</ion-label> <ion-input></ion-input> </ion-item> <ion-item> <ion-label position="fixed">Fixed Label</ion-label> <ion-input></ion-input> </ion-item> <ion-item> <ion-label position="stacked">Stacked Label</ion-label> <ion-input></ion-input> </ion-item>