擴充套件使用

Ionic 有一些 CSS 元件，你可以使用 Ionicons 作為預設設定，具有預設樣式。專案 <div> 中的 range 類將對輸入和其中的圖示應用正確的樣式。這是一個範圍滑塊的示例。

<div class="item range">
  <i class="icon ion-volume-low"></i>
  <input type="range" name="volume">
  <i class="icon ion-volume-high"></i>
</div>

在 Ionic 選項卡中使用 Ionicon 的另一個例子，它將建立一個像選單一樣的選項卡。tabs-striped tabs-color-assertive 類定義選項卡本身的樣式。圖示與簡單的 <i> 標籤一起使用，並且它們從應用於父 div 的類中獲得它們的位置樣式。

<div class="tabs-striped tabs-color-assertive">
  <div class="tabs">
    <a class="tab-item" href="#">
      <i class="icon ion-home"></i>
      Home
    </a>
    <a class="tab-item" href="#">
      <i class="icon ion-gear-b"></i>
      Settings
    </a>
</div>