0
我正在創建一個包含會議發言人信息的頁面,並希望在主工具欄下方顯示其圖片,然後在選項卡格式下顯示圖片下面的配置文件,評分和聯繫信息,以免移動應用上的長頁面。在頁面內容中定位溫泉UI選項卡
到目前爲止,實例看到的只是標籤的頂部或底部,並不總是在實際應用中使用它們的唯一方法。
如果框架已經提供了一個,我該如何以一種乾淨的方式實現這個功能?
我正在創建一個包含會議發言人信息的頁面,並希望在主工具欄下方顯示其圖片,然後在選項卡格式下顯示圖片下面的配置文件,評分和聯繫信息,以免移動應用上的長頁面。在頁面內容中定位溫泉UI選項卡
到目前爲止,實例看到的只是標籤的頂部或底部,並不總是在實際應用中使用它們的唯一方法。
如果框架已經提供了一個,我該如何以一種乾淨的方式實現這個功能?
而不是使用<ons-tabbar>
自定義元素,你可以只使用CSS。
的CSS,請訪問: http://components.onsen.io/
<div class="my-tab-bar tab-bar">
<label class="tab-bar__item">
<input type="radio" name="tab-bar-a" checked="checked">
<button class="tab-bar__button">
<i class="tab-bar__icon ion-stop"></i>
<div class="tab-bar__label">One</div>
</button>
</label>
<label class="tab-bar__item">
<input type="radio" name="tab-bar-a">
<button class="tab-bar__button">
<i class="tab-bar__icon ion-record"></i>
<div class="tab-bar__label">Two</div>
</button>
</label>
<label class="tab-bar__item">
<input type="radio" name="tab-bar-a">
<button class="tab-bar__button">
<i class="tab-bar__icon ion-star"></i>
<div class="tab-bar__label">Three</div>
</button>
</label>
</div>
但這種定位在頂部,這樣你將不得不覆蓋CSS:
.my-tab-bar {
position: initial;
}