Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/dart/3.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Ionic2 如何在ion卡上创建页脚_Ionic2_Ionic3 - Fatal编程技术网

Ionic2 如何在ion卡上创建页脚

Ionic2 如何在ion卡上创建页脚,ionic2,ionic3,Ionic2,Ionic3,如何在ion卡上创建页脚。尝试以下示例,但不起作用。请帮助 .Html 数控10 页脚在此// 您需要在ion-card中使用ion col和ion row。它可以工作 <ion-content fullscreen> <ion-card> <ion-card-header class="cardheader"> CNC 10 </ion-card-header> <ion-card-content

如何在ion卡上创建页脚。尝试以下示例,但不起作用。请帮助

.Html


数控10
页脚在此//

您需要在ion-card中使用ion col和ion row。它可以工作

<ion-content fullscreen>
  <ion-card>
   <ion-card-header class="cardheader">
      CNC 10
    </ion-card-header> 

    <ion-card-content>
     Content of the card
    </ion-card-content>

    <ion-row class="cardfooter">
      <ion-col>
            <p>Footer goes here </p>
      </ion-col>
    </ion-row>
  </ion-card>
</ion-content>

数控10
卡片内容
页脚在这里


使用并完成其他答案:

下面是所有代码:

HTML:

  <ion-card class="has-card-footer">
      <ion-card-header>
          CNC 10
      </ion-card-header> 

      <ion-row class="card-footer">
          <ion-col>
              <p>Footer goes here </p>
          </ion-col>
      </ion-row>
  </ion-card>

是的,这是在
ion卡上添加页脚的推荐/最佳方法
Electronic 4中的组件。
  <ion-card class="has-card-footer">
      <ion-card-header>
          CNC 10
      </ion-card-header> 

      <ion-row class="card-footer">
          <ion-col>
              <p>Footer goes here </p>
          </ion-col>
      </ion-row>
  </ion-card>
.card-footer {
  position: absolute;
  bottom: 0;
  width: 100%;
}

.has-card-footer {
  padding-bottom: 15px;
}