离子选项卡默认情况下显示在底部

Question

我试图在页面顶部显示离子选项卡，但没有理由不发生。我试着明确地将$ionicConfigProvider.tabs.position('top');放入.config(function($stateProvider, $urlRouterProvider, $ionicConfigProvider)，但没有任何变化。

这里是我的代码

<div class = "tabs-striped tabs-background-positive tabs-color-light"> 
<div class = "tabs"> 
<a class = "tab-item"> 
<i class = "icon ion-home"></i> 
</a>   
<a class = "tab-item active"> 
<i class = "icon ion-star"></i> 
</a> 
<a class = "tab-item"> 
<i class = "icon ion-planet"></i> 
</a> 
</div> 
</div> 

Answer 1

<ion-tabs class="has-tabs-top"> 
    //here put your all tabs 
</ion-tabs> 

可以覆盖离子CSS默认属性第二种方法：

@media not all, (-webkit-min-device-pixel-ratio: 1.5), not all, (min-resolution: 144dpi), (min-resolution: 1.5dppx) 
.tabs { 
padding-top: 2px; 
border-top: none !important; 
border-bottom: none; 
background-position: top; 
background-size: 100% 1px; 
background-repeat: no-repeat; 
**position: fixed; 
top: 0px;** 
} 

希望这会帮助你。