Question

我想根据每个屏幕尺寸或方向设置我的离子导航栏。从我的代码中，当我以横向方向查看时，它的高度会发生变化。

ReactDOM.render(
    <Router history={hashHistory}>
      <div> 
        <Route path="/" component={Main} />
        <Route path="/Weather" component={Weather} />
        <Route path="/About" component={About} />
      </div>
    </Router>,
    document.getElementById('app')
);

CSS：

  <ion-nav-bar class=" blue" >
          <ion-nav-buttons side="left">
            <!-- <button class="button  button-icon  ion-navicon blue" menu-
            toggle="left"></button>-->
            <button class="button button-clear" menu-toggle="left"><img 
            src="img\menu.png"  width="22" style="vertical-align: middle">
           </button>
           <img src="img\logo.png" width="33vw"   style="vertical-align: 
           middle" >
          </ion-nav-buttons>
        </ion-nav-bar></div>

Answer 1

而不是在＆＃39; vw＆＃39;中使用宽度。提供百分比，如100％或任何你喜欢的百分比。导航栏的宽度为％age。

希望它有所帮助！

使离子导航条响应不同的方向

1 个答案: