在Ionic 3 Framework中禁用隐藏在离子页脚和离子头上的溢出

Question

我一直在使用ionic3中的应用程序。我用按钮创建了一个离子页脚。我需要弹出一个中间按钮，但是离子页脚隐藏它就像它有CSS溢出：隐藏应用于它。

我想让我的离子页脚像这样：

但得到这个：

我正在尝试的是：

.middle-nav-icon {
        color: $appRed;
        border: $appRed 1px solid;
        width: 55px;
        height: 55px;
        line-height: 55px;
        border-radius: 50%;
        background: #ffffff;
        font-size: 30px;
        margin-top: -50px;
        margin-bottom: 7px;
      }

Answer 1

您应该在CSS中使用z-index。它定义了每个div的重要性（优先级）。如果你放了一个大的z-index，那么div会被推高并出现在div的顶部。您可以咨询documentation。

尝试这样的事情：

.middle-nav-icon {
        color: $appRed;
        border: $appRed 1px solid;
        width: 55px;
        height: 55px;
        line-height: 55px;
        border-radius: 50%;
        background: #ffffff;
        font-size: 30px;
        margin-top: -50px;
        margin-bottom: 7px;
        z-index: 1;
      }