以 phonegap + angular JS + 温泉为中心

Question

我们正在使用 phonegap + angular JS + onsen 创建应用程序。我们正在使用无法使 header 居中的模态。下面的代码。

<ons-modal var="modalVariable">
   <ons-navigator var="detailsNavigator">
      <ons-toolbar>
         <div class="center">Header that needs to be centered.</div>
      </ons-toolbar>
      <ons-scroller>
         <ons-list>
            <ons-list-item class="bux-text">
               <ons-row>
                  <ons-col>
                     <div style="line-height: 20px">
                        Some Information Here
                     </div>
                  </ons-col>
               </ons-row>
            </ons-list-item>
         </ons-list>
      </ons-scroller>
      <ons-row>
         <ons-col>
            <ul class="list">
               <li class="list__item" style="margin: 10px 0;">
                  <ons-button style="width: 100%;" type="submit" modifier="large" ng-click="modalVariable.hide()">CONFIRM</ons-button>
               </li>
            </ul>
         </ons-col>
      </ons-row>
   </ons-navigator>
</ons-modal>

它不以应用程序为中心，而是在您检查它时以浏览器为中心。

我什至尝试在下方使用，但仍然无法在模态中心显示 header。

<ons-toolbar>
     <div class="center" style="text-align: center;" >Header that needs to be centered.</div>
</ons-toolbar>

Answer 1

您尝试过吗：<ons-toolbar fixed-style>？

http://onsen.io/reference/ons-toolbar.html#attributes

以 phonegap + angular JS + 温泉为中心

Centering on phonegap + angular JS + onsen

html

javascript

angularjs

cordova

onsen-ui