自定义或删除离子行之间的空间

Question

我正在学习Ionic app。我介绍了Grid的东西，然而，我被困在删除/修改行之间的空格（第2行和第3行），如下面的屏幕截图所示：

我的HTML中有以下代码：

"postal_code"

SCSS：

<ion-content padding>
    <ion-row>     
      <ion-label> I am good I do not want any space.</ion-label>
    </ion-row>
  <ion-row>
    <div >
      <div class="inner">
        <ion-label *ngIf="!inverse"  no-margin>1 USD = 67 INR</ion-label>
        <ion-label *ngIf="inverse" no-margin>1 INR = {{(1/67) | number }} USD </ion-label>
      </div>
      <button (click)="inverse=!inverse" ion-button clear class="iconWidth" color="dark">  <ion-icon name="swap" class="rotate"></ion-icon></button>
    </div>
  </ion-row>
<ion-row>
  <p>Can you help me to get rid of space between this row and above</p>
  <ion-label> Thanks</ion-label>
</ion-row>
</ion-content>

如何自定义第2行和第3行之间的差距？

Answer 1

尝试使用此$HOME和no-padding以及其他您想要的人

no-margin

或

  <ion-row no-padding>
  <p no-margin>Can you help me to get rid of space between this row and above</p>
  <ion-label> Thanks</ion-label>

Answer 2

使用否定margin-top

<强> HTML

<ion-row class="bottomRow">
  <p>Can you help me to get rid of space between this row and above</p>

<强> SCSS

 .bottomRow
{
  margin-top: -20px;
}

Stackblitz Example

Answer 3

对我有用的是进入标记，将其与class="foo"链接，然后设置.foo{padding:0px}