Материал - значки действий
В этой главе объясняется использование значков действий Google (Материальных). Предположим, чтоcustom - это имя класса CSS, в котором мы определили размер и цвет, как показано в приведенном ниже примере.
<!DOCTYPE html>
<html>
<head>
<link href = "https://fonts.googleapis.com/icon?family=Material+Icons" rel = "stylesheet">
<style>
i.custom {font-size: 2em; color: green;}
</style>
</head>
<body>
<i class = "material-icons custom">accessibility</i>
</body>
</html>
В следующей таблице приведены использование и результаты значков действий Google (Материальных). Замените тег <body> указанной выше программы кодом, приведенным в таблице, чтобы получить соответствующие выходные данные -
| Применение | Результат |
|---|---|
| <i class = "material-icons custom"> 3d_rotation </i> | 3d_rotation |
| <i class = "material-icons custom"> специальные возможности </i> | доступность |
| <i class = "material-icons custom"> account_balance </i> | остаток на счету |
| <i class = "material-icons custom"> account_balance_wallet </i> | account_balance_wallet |
| <i class = "material-icons custom"> account_box </i> | account_box |
| <i class = "material-icons custom"> account_circle </i> | account_circle |
| <i class = "material-icons custom"> add_shopping_cart </i> | add_shopping_cart |
| <i class = "material-icons custom"> будильник </i> | аварийная сигнализация |
| <i class = "material-icons custom"> alarm_add </i> | alarm_add |
| <i class = "material-icons custom"> alarm_off </i> | alarm_off |
| <i class = "material-icons custom"> alarm_on </i> | alarm_on |
| <i class = "material-icons custom"> android </i> | андроид |
| <i class = "material-icons custom"> объявление </i> | объявление |
| <i class = "material-icons custom"> aspect_ratio </i> | соотношение сторон |
| <i class = "material-icons custom"> оценка </i> | оценка |
| <i class = "material-icons custom"> назначение </i> | назначение |
| <i class = "material-icons custom"> assignment_ind </i> | assignment_ind |
| <i class = "material-icons custom"> assignment_late </i> | assignment_late |
| <i class = "material-icons custom"> assignment_return </i> | assignment_return |
| <i class = "material-icons custom"> assignment_returned </i> | assignment_returned |
| <i class = "material-icons custom"> assignment_turned_in </i> | assignment_turned_in |
| <i class = "material-icons custom"> автообновление </i> | авто-обновление |
| <i class = "material-icons custom"> резервная копия </i> | резервное копирование |
| <i class = "material-icons custom"> книга </i> | книга |
| <i class = "material-icons custom"> закладка </i> | закладка |
| <i class = "material-icons custom"> bookmark_border </i> | bookmark_border |
| <i class = "material-icons custom"> bug_report </i> | сообщение об ошибке |
| <i class = "material-icons custom"> сборка </i> | строить |
| <i class = "material-icons custom"> кешировано </i> | кешированный |
| <i class = "material-icons custom"> camera_enhance </i> | camera_enhance |
| <i class = "material-icons custom"> card_giftcard </i> | card_giftcard |
| <i class = "material-icons custom"> card_membership </i> | card_membership |
| <i class = "material-icons custom"> card_travel </i> | card_travel |
| <i class = "material-icons custom"> change_history </i> | change_history |
| <i class = "material-icons custom"> check_circle </i> | check_circle |
| <i class = "material-icons custom"> chrome_reader_mode </i> | chrome_reader_mode |
| <i class = "material-icons custom"> класс </i> | класс |
| <i class = "material-icons custom"> код </i> | код |
| <i class = "material-icons custom"> кредитная_карта </i> | кредитная карта |
| <i class = "material-icons custom"> панель управления </i> | приборная доска |
| <i class = "material-icons custom"> удалить </i> | удалять |
| <i class = "material-icons custom"> описание </i> | описание |
| <i class = "material-icons custom"> dns </i> | DNS |
| <i class = "material-icons custom"> готово </i> | сделанный |
| <i class = "material-icons custom"> done_all </i> | done_all |
| <i class = "material-icons custom"> извлечь </i> | выбросить |
| <i class = "material-icons custom"> событие </i> | событие |
| <i class = "material-icons custom"> event_seat </i> | event_seat |
| <i class = "material-icons custom"> exit_to_app </i> | exit_to_app |
| <i class = "material-icons custom"> изучить </i> | исследовать |
| <i class = "material-icons custom"> расширение </i> | расширение |
| <i class = "material-icons custom"> лицо </i> | лицо |
| <i class = "material-icons custom"> избранное </i> | любимый |
| <i class = "material-icons custom"> favourite_border </i> | избранное_бордер |
| <i class = "material-icons custom"> отзыв </i> | Обратная связь |
| <i class = "material-icons custom"> find_in_page </i> | find_in_page |
| <i class = "material-icons custom"> find_replace </i> | find_replace |
| <i class = "material-icons custom"> flight_land </i> | flight_land |
| <i class = "material-icons custom"> flight_takeoff </i> | flight_takeoff |
| <i class = "material-icons custom"> flip_to_back </i> | flip_to_back |
| <i class = "material-icons custom"> flip_to_front </i> | flip_to_front |
| <i class = "material-icons custom"> get_app </i> | скачать приложение |
| <i class = "material-icons custom"> gif </i> | гифка |
| <i class = "material-icons custom"> оценка </i> | оценка |
| <i class = "material-icons custom"> group_work </i> | групповая работа |
| <i class = "material-icons custom"> справка </i> | Помогите |
| <i class = "material-icons custom"> help_outline </i> | help_outline |
| <i class = "material-icons custom"> highlight_off </i> | highlight_off |
| <i class = "material-icons custom"> история </i> | история |
| <i class = "material-icons custom"> главная </i> | Главная |
| <i class = "material-icons custom"> hourglass_empty </i> | песочные часы пустые |
| <i class = "material-icons custom"> песочные часы_full </i> | песочные часы |
| <i class = "material-icons custom"> http </i> | http |
| <i class = "material-icons custom"> https </i> | https |
| <i class = "material-icons custom"> информация </i> | Информация |
| <i class = "material-icons custom"> info_outline </i> | info_outline |
| <i class = "material-icons custom"> ввод </i> | ввод |
| <i class = "material-icons custom"> invert_colors </i> | invert_colors |
| <i class = "material-icons custom"> ярлык </i> | метка |
| <i class = "material-icons custom"> label_outline </i> | label_outline |
| <i class = "material-icons custom"> язык </i> | язык |
| <i class = "material-icons custom"> запуск </i> | запускать |
| Список <i class = "material-icons custom"> </i> | список |
| <i class = "material-icons custom"> замок </i> | замок |
| <i class = "material-icons custom"> lock_open </i> | lock_open |
| <i class = "material-icons custom"> lock_outline </i> | lock_outline |
| <i class = "material-icons custom"> лояльность </i> | верность |
| <i class = "material-icons custom"> markunread_mailbox </i> | markunread_mailbox |
| <i class = "material-icons custom"> note_add </i> | note_add |
| <i class = "material-icons custom"> offline_pin </i> | offline_pin |
| <i class = "material-icons custom"> open_in_browser </i> | открыть в браузере |
| <i class = "material-icons custom"> open_in_new </i> | open_in_new |
| <i class = "material-icons custom"> open_with </i> | открыть с |
| <i class = "material-icons custom"> просмотр страницы </i> | Вид страницы |
| <i class = "material-icons custom"> оплата </i> | оплата |
| <i class = "material-icons custom"> perm_camera_mic </i> | perm_camera_mic |
| <i class = "material-icons custom"> perm_contact_cale </i> | perm_contact_cale |
| <i class = "material-icons custom"> perm_data_settings </i> | perm_data_settings |
| <i class = "material-icons custom"> perm_device_information </i> | perm_device_information |
| <i class = "material-icons custom"> perm_identity </i> | perm_identity |
| <i class = "material-icons custom"> perm_media </i> | perm_media |
| <i class = "material-icons custom"> perm_phone_msg </i> | perm_phone_msg |
| <i class = "material-icons custom"> perm_scan_wifi </i> | perm_scan_wifi |
| <i class = "material-icons custom"> picture_in_picture </i> | picture_in_picture |
| <i class = "material-icons custom"> play_for_work </i> | play_for_work |
| <i class = "material-icons custom"> полимер </i> | полимер |
| <i class = "material-icons custom"> power_settings_new </i> | power_settings_new |
| <i class = "material-icons custom"> печать </i> | Распечатать |
| <i class = "material-icons custom"> query_builder </i> | query_builder |
| <i class = "material-icons custom"> question_answer </i> | вопрос ответ |
| <i class = "material-icons custom"> квитанция </i> | чек |
| <i class = "material-icons custom"> активировать </i> | выкупать |
| <i class = "material-icons custom"> изменить порядок </i> | Изменение порядка |
| <i class = "material-icons custom"> report_problem </i> | Отчет о проблемах |
| <i class = "material-icons custom"> восстановить </i> | восстановить |
| <i class = "material-icons custom"> комната </i> | комната |
| <i class = "material-icons custom"> расписание </i> | график |
| <i class = "material-icons custom"> поиск </i> | поиск |
| <i class = "material-icons custom"> настройки </i> | настройки |
| <i class = "material-icons custom"> settings_applications </i> | settings_applications |
| <i class = "material-icons custom"> settings_bluetooth </i> | settings_bluetooth |
| <i class = "material-icons custom"> settings_brightness </i> | settings_brightness |
| <i class = "material-icons custom"> settings_cell </i> | settings_cell |
| <i class = "material-icons custom"> settings_ethernet </i> | settings_ethernet |
| <i class = "material-icons custom"> settings_input_antenna </i> | settings_input_antenna |
| <i class = "material-icons custom"> settings_input_component </i> | settings_input_component |
| <i class = "material-icons custom"> settings_input_hdmi </i> | settings_input_hdmi |
| <i class = "material-icons custom"> settings_input_svideo </i> | settings_input_svideo |
| <i class = "material-icons custom"> settings_overscan </i> | settings_overscan |
| <i class = "material-icons custom"> settings_phone </i> | settings_phone |
| <i class = "material-icons custom"> settings_power </i> | settings_power |
| <i class = "material-icons custom"> settings_remote </i> | settings_remote |
| <i class = "material-icons custom"> settings_voice </i> | settings_voice |
| <i class = "material-icons custom"> магазин </i> | магазин |
| <i class = "material-icons custom"> shop_two </i> | shop_two |
| <i class = "material-icons custom"> корзина_ покупок </i> | корзина покупателя |
| <i class = "material-icons custom"> shopping_cart </i> | корзина |
| <i class = "material-icons custom"> speaker_notes </i> | Speaker_notes |
| <i class = "material-icons custom"> проверка орфографии </i> | проверка орфографии |
| <i class = "material-icons custom"> star_rate </i> | star_rate |
| <i class = "material-icons custom"> звезды </i> | звезды |
| <i class = "material-icons custom"> магазин </i> | хранить |
| <i class = "material-icons custom"> тема </i> | тема |
| <i class = "material-icons custom"> supervisor_account </i> | supervisor_account |
| <i class = "material-icons custom"> swap_horiz </i> | swap_horiz |
| <i class = "material-icons custom"> swap_vert </i> | swap_vert |
| <i class = "material-icons custom"> swap_vertical_circle </i> | swap_vertical_circle |
| <i class = "material-icons custom"> system_update_alt </i> | system_update_alt |
| Вкладка <i class = "material-icons custom"> </i> | вкладка |
| <i class = "material-icons custom"> tab_unselected </i> | tab_unselected |
| <i class = "material-icons custom"> театры </i> | театры |
| <i class = "material-icons custom"> thumb_down </i> | thumb_down |
| <i class = "material-icons custom"> thumb_up </i> | палец вверх |
| <i class = "material-icons custom"> thumbs_up_down </i> | thumbs_up_down |
| <i class = "material-icons custom"> toc </i> | toc |
| <i class = "material-icons custom"> сегодня </i> | Cегодня |
| <i class = "material-icons custom"> платные </i> | Потери |
| <i class = "material-icons custom"> track_changes </i> | отслеживать изменения |
| <i class = "material-icons custom"> перевести </i> | переведите |
| <i class = "material-icons custom"> trending_down </i> | trending_down |
| <i class = "material-icons custom"> trending_flat </i> | trending_flat |
| <i class = "material-icons custom"> trending_up </i> | trending_up |
| <i class = "material-icons custom"> Turn_in </i> | Turn_in |
| <i class = "material-icons custom"> Verified_user </i> | проверенный_пользователь |
| <i class = "material-icons custom"> view_agenda </i> | view_agenda |
| <i class = "material-icons custom"> view_array </i> | view_array |
| <i class = "material-icons custom"> view_carousel </i> | view_carousel |
| <i class = "material-icons custom"> view_column </i> | view_column |
| <i class = "material-icons custom"> view_day </i> | view_day |
| <i class = "material-icons custom"> view_headline </i> | view_headline |
| <i class = "material-icons custom"> view_list </i> | view_list |
| <i class = "material-icons custom"> view_module </i> | view_module |
| <i class = "material-icons custom"> view_quilt </i> | view_quilt |
| <i class = "material-icons custom"> view_stream </i> | view_stream |
| <i class = "material-icons custom"> view_week </i> | view_week |
| <i class = "material-icons custom"> видимость </i> | видимость |
| <i class = "material-icons custom"> visibility_off </i> | visibility_off |
| <i class = "material-icons custom"> работа </i> | Работа |
| <i class = "material-icons custom"> youtube_searched_for </i> | youtube_searched_for |
| <i class = "material-icons custom"> zoom_in </i> | приблизить |
| <i class = "material-icons custom"> zoom_out </i> | уменьшить |