Remove line under a field

Ionic is making line below after each field I am creating. how can I remove this line? What this line thing “officially” called? Is it removable by CSS?

My code:

<ion-grid style="height: 100%;" class="something-semantic">

  <ion-row class="something-else-semantic">

    <ion-col size-md="6" offset-md="3" class="something-semantic">

      <ion-card style="height: 100%;" class="something-else-semantic">

        <ion-card-header>

          <ion-card-title>

          </ion-card-title>

        </ion-card-header>

        <ion-card-content>

          <ion-item>

            <ion-thumbnail slot="start">

              <!-- <ion-img [src]="../../assets/logos/logo1.png"></ion-img> -->

              <img src="../../assets/logos/logo1.png">

            </ion-thumbnail>

            <ion-text style="color:#7fba00; font-weight: bolder; ">Cool Website</ion-text>

          </ion-item>

          <ion-item>

            <ion-text>Sign in</ion-text>

          </ion-item>

          <ion-item hidden>

            <ion-text style="color: red;">

              Account doesn't exist. Enter a different account or <a>get a new one.</a>

            </ion-text>

          </ion-item>

          <ion-item>

            <ion-input placeholder="Email or Username"></ion-input>

          </ion-item>

          <ion-item>

            <ion-text> Don't have an account? <a>Sign up</a> </ion-text>

          </ion-item>

          <div class="ion-margin-vertical ion-text-center">

            <ion-button fill="solid" expand="block" color="secondary" size="small"

              style="text-transform: none; width:auto;">Next</ion-button>

          </div>

        </ion-card-content>

      </ion-card>

    </ion-col>

  </ion-row>

</ion-grid>

Untitled2

A second question is : why image is working when using relative path and normal html image tag, but not working when using ion image tag? [ see my code ]

How about the lines property of <ion-item>?

1 Like