移除Ion-Toolbar Ionic V4中的边框(4.0.9)

问题描述 投票:0回答:2

我疯了......需要帮助从Ionic v4(4.0.9)的ion-toolbar中移除ion-header的边界。

我的目标是删除这个:

my two toolbars with borders

在我的代码中,我有一个ion-header与两个ion-toolbar

<ion-header no-border-bottom no-border-top no-border>
  <ion-toolbar color="dark" no-border-bottom no-border-top no-border>
    <img src="../../assets/icoUserLogin.png" alt="Logo Aikox" slot="start" witdh="20%" />
    <ion-title slot="primary">
      Test
    </ion-title>
  </ion-toolbar>
  <ion-toolbar class="ToolbarVerde" color="medium" no-border-bottom no-border-top no-border>
    <ion-buttons slot="start">
      <img src="../../assets/icoListado.png" alt="Icono Listado" slot="start" width="70%" />
    </ion-buttons>
    <ion-title>
      <span>test</span>
      <br />
      <span>test</span>
    </ion-title>
    <ion-buttons slot="primary">
      <ion-button (click)="Nuevo()">
        <img src="../../assets/icoRefresh.png" alt="Icono Recargar" width="70%" /><br />
      </ion-button>
      <ion-button (click)="Nuevo()">
        <img src="../../assets/icoNew.png" alt="Añadir Parte de Trabajo" width="70%" /><br />
      </ion-button>
    </ion-buttons>
  </ion-toolbar>
</ion-header>

我已经尝试了qazxsw poi和no-border内的所有qazxsw poi属性

我也尝试将属性添加到我的页面的.css中,如下所示:

ion-header

但这一切都没有用,我过去3个月一直在使用Ionic v4,这是我第一次遇到问题。

html css ionic-framework ionic4
2个回答
6
投票

嗨这可能对某人有帮助

ion-toolbar

这将删除ionic4中的行


0
投票

最后得到它,对于任何有这个问题的人:

.toolbar-background{ --border-width: 0px !important; border: 0 !important; } .toolbar-container{ --padding-top: 0px !important; --padding-left: 0px !important; --padding-right: 0px !important; --padding-bottom: 0px !important; padding-top: 0px !important; padding-left: 0px !important; padding-right: 0px !important; padding-bottom: 0px !important; } .ToolbarVerde{ --padding-top: 0px !important; --padding-left: 0px !important; --padding-right: 0px !important; --padding-bottom: 0px !important; padding-top: 0px !important; padding-left: 0px !important; padding-right: 0px !important; padding-bottom: 0px !important; }中添加一个类,然后在.scss中使用以下代码:

<ion-header no-border >

</ion-header>

这神奇地工作......希望它能帮到某个人!

© www.soinside.com 2019 - 2024. All rights reserved.