jQueryモバイルアイコン
アイコン クラスを使用して、jQuery Mobile の <a> 要素と <button> 要素にアイコンを追加し、次のようにアイコンを配置できます。 ui-btn
ui-icon-refresh ui-btn-icon-left">ページを更新</a>試してみる
<button class="ui-btn
">ページを更新</button>試してみる
<input> ボタンにアイコンを追加するには、data-icon 属性を使用できます:
< a href ="#anylink"
data-icon="refresh">ページを更新</a>試してみる
data-icon 属性を使用して、ナビゲーション ボタンにアイコンを追加できます:
<a href="#anylink"
data-icon="refresh">ページを更新</a>試してみる
リスト ボタンにアイコンを追加したい場合は、 <li> 属性で data-icon を使用できます:
<li
data-icon="refresh"><a href="#">Click me</a></li> ;試してみてください
以下に、jQuery Mobile が提供する利用可能なアイコンをすべてリストします:
| 値 | 説明 | アイコン | インスタンス |
|---|---|---|---|
| アクション | アクション | 試してみる | |
| アラート | 警告 | 試してみる | |
| オーディオ | ビデオ/オーディオ/スピーカー | 試してみる | |
| arrow-d-l | 左下 | 試してみる | |
| arrow -d-r | 右下隅 | 試してみてください | |
| arrow-u-l | 左上隅 | 試してみてください | |
| arrow-u-r | 上右隅コーナー | 試してみる | |
| arrow-l | 左矢印 | 試してみる | |
| arrow-r | 右矢印 | ||
| 上矢印 | |||
| 下矢印 | |||
| 戻る | |||
| コラム | 試してみる | ||
| 弾丸 | フェンス | 試してみる | |
| カレンダー | カレンダー | 試してみる | |
| カメラ | カメラ | 試してみる | |
| カラット-d | 下 | 試してみる | |
| カラット-l | 左 | 試してみる | |
| carat-r | そうです | 試してみましょう | |
| carat-u | up | 試してみる | |
| check | 認証マーク | 試してみる | |
| 時計 | 時計 | 試してみましょう試してみる | |
| クラウド | クラウド | 試してみる | |
| コメント | コメント | 試してみる | |
| 削除 | 削除(X) | 試してみる | |
| 編集 | 編集/鉛筆 | 試してみる | |
| 目 | 目 | 試してみる | |
| 禁止 | まだマーク | 試してみる | |
| 進む | 進む | 試してみる | |
| ギア | ギア | 試してみる | |
| グリッド | グリッド | 試してみる | |
| ハート | ハート/ラブサイン | 試してみる | |
| ホーム | ホーム (ホーム) | 試してみるそれ | |
| 情報 | 情報 | 試してみる | |
| 位置 | 位置/GPS | 試してみる | |
| ロック | ロック/南京錠 | 与えてみる試してみましょう | |
| メール | メール/封筒 | ナビゲーション | |
| 試してみましょう | 電話 | ||
| 試してみる | |||
| plus | plus | 試してみる | |
| リサイクル | リサイクル | 試してみる | |
| リフレッシュ | リフレッシュ | 試してみる | |
| 検索 | 検索 | 試してみる | |
| ショップ | ショップ、財布、ハンドバッグ | 試してみる | |
| スター | スター | 試してみる試してみる | |
| tag | tag | カメラ | |
| 試してみる |
