Question

我正在更改离子选项卡按钮样式以使中心按钮比其他按钮大。在我的Android设备中，它看起来很正常，但是当我部署到iOS设备时，中心按钮显示不正确。我需要在哪里更改以解决样式问题？

.ion-ios-homeImg:before{
  content: '';
  width: 60px;
  height:60px;
  display: block;
  background: no-repeat center url("../assets/imgs/scantab.png");
  background-size: contain;
}

.ion-ios-homeImg-outline:before{
  content: '';
  width: 60px;
  height: 60px;
  display: block;
  background: no-repeat center url("../assets/imgs/scantab.png");
  background-size: contain;  
}
.ion-md-homeImg:before{
  content: '';
  width: 60px;
  height: 60px;
  display: block;
  background: no-repeat center url("../assets/imgs/scantab.png");
  background-size: contain; 
}

.tab-button-icon{
  overflow: visible;
}

.tab-button.has-icon.icon-only.disable-hover {
  position: relative;
  .tab-button-icon{
    position: fixed;
    bottom: 16px;
    left: calc(50% - 30px);
    z-index: 9999999;
}

1.Android https://github.com/yl847866341/Heart/blob/master/QQ20190125-0.png
2.iOS https://github.com/yl847866341/Heart/blob/master/Screenshot_2019-01-25-11-05-39-185_com.legend.sta.png

Answer 1

我在模拟器上调试我的应用，并将底部更改为30px。问题已解决。

如何修复Ionic标签图标在Android iOS设备上的显示不同？

1 个答案: