jQuery Mobile Иконки
Мы можем использовать классы иконок, чтобы добавлять иконки к элементам <a> и <button> в jQuery Mobile, и располагать иконки следующим образом:
<a href="../index.html" class="ui-btn ui-icon-refresh ui-btn-icon-left">Обновить страницу</a>Попробовать
<button class="ui-btn ui-icon-refresh ui-btn-icon-left">Обновить страницу</button>Попробовать
Чтобы добавить иконку к кнопке <input>, можно использовать атрибут data-icon:
<a href="../index.html" data-icon="refresh">Обновить страницу</a>Попробовать
Мы можем использовать атрибут data-icon, чтобы добавлять иконки к кнопкам навигации:
<a href="../index.html" data-icon="refresh">Обновить страницу</a>Попробовать
Чтобы добавить иконку к кнопке списка, можно использовать атрибут data-icon внутри <li>:
<li data-icon="refresh">Нажми меняПопробовать
Ниже перечислены все доступные иконки, предоставляемые jQuery Mobile:
| Значение | Описание | Значок | Пример |
|---|---|---|---|
| action | Действие | Попробуйте | |
| alert | Предупреждение | Попробуйте | |
| аудио | Видео / Аудио / Динамик | Попробуйте | |
| arrow-d-l | Внизу слева | Попробуйте | |
| arrow-d-r | Внизу справа | Попробуйте | |
| arrow-u-l | Вверху слева | Попробуйте | |
| arrow-u-r | Вверху справа | Попробуйте | |
| arrow-l | Стрелка влево | Попробуйте | |
| arrow-r | Стрелка вправо | Попробуйте | |
| arrow-u | Стрелка вверх | Попробуйте | |
| arrow-d | Стрелка вниз | Попробуйте | |
| back | Назад | Попробуйте | |
| bars | Column | Попробуйте | |
| bullets | Bars | Попробуйте | |
| calendar | Calendar | Попробуйте | |
| camera | Камера | Попробуйте | |
| carat-d | Down | Попробуйте | |
| carat-l | По левому краю | Попробуйте | |
| carat-r | Вправо | Попробуйте | |
| carat-u | Вверх | Попробуйте | |
| check | Галочка | Попробуйте | |
| часы | Часы | Попробуйте | |
| облако | Облачный | Попробуйте | |
| комментарий | Комментарий | Попробуйте | |
| удаление | Удалить (X) | Попробуйте | |
| edit | Редактировать / Карандаш | Попробуйте | |
| глаз | Глаз | Попробуйте | |
| запрещено | Знак запрета | Попробуйте | |
| вперёд | Вперёд | Попробуйте | |
| шестерёнка | Шестерёнка | Попробуйте | |
| grid | Сетка | Попробуйте | |
| сердце | Сердце / знак любви | Попробуйте | |
| дом | Главная (домашняя страница) | Попробуйте | |
| информация | Информация | Попробуйте | |
| location | Местоположение / GPS | Попробуйте | |
| lock | Замок / навесной замок | Попробуйте | |
| почта | Почта / Конверт | Попробуйте | |
| minus | Знак, минус | Попробуйте | |
| навигация | Навигация | Попробуйте | |
| phone | Телефон | Попробуйте | |
| степень | Переключатель (вкл./выкл.) | Попробуйте | |
| plus | Плюс | Попробуйте | |
| переработка | Переработка | Попробуйте | |
| refresh | Обновить | Попробуйте | |
| search | Поиск | Попробуйте | |
| магазин | Магазин, кошелёк, сумка | Попробуйте | |
| star | Star | Попробуйте | |
| тег | Тег | Попробуйте | |
| user | Пользователь | Попробуйте | |
| video | Видеокамера | Попробуйте |