Materiał - ikony akcji
W tym rozdziale wyjaśniono użycie ikon działań Google (materiałów). Zakładać, żecustom to nazwa klasy CSS, w której zdefiniowaliśmy rozmiar i kolor, jak pokazano w przykładzie podanym poniżej.
<!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>Poniższa tabela zawiera wykorzystanie i wyniki ikon działań Google (materiałów). Zastąp tag <body> powyższego programu kodem podanym w tabeli, aby uzyskać odpowiednie wyniki -
| Stosowanie | Wynik |
|---|---|
| <i class = "material-icons custom"> 3d_rotation </i> | 3d_rotation |
| <i class = "material-icons custom"> dostępność </i> | dostępność |
| <i class = "material-icons custom"> account_balance </i> | bilans konta |
| <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"> alarm </i> | alarm |
| <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> | android |
| <i class = "material-icons custom"> ogłoszenie </i> | ogłoszenie |
| <i class = "material-icons custom"> współczynnik_ aspektu </i> | współczynnik_ aspektu |
| <i class = "material-icons custom"> ocena </i> | oszacowanie |
| <i class = "material-icons custom"> przypisanie </i> | zadanie |
| <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"> autorenew </i> | autorenew |
| <i class = "material-icons custom"> kopia zapasowa </i> | utworzyć kopię zapasową |
| <i class = "material-icons custom"> książka </i> | książka |
| <i class = "material-icons custom"> zakładka </i> | zakładka |
| <i class = "material-icons custom"> bookmark_border </i> | bookmark_border |
| <i class = "material-icons custom"> bug_report </i> | Zgłoszenie błędu |
| <i class = "material-icons custom"> kompilacja </i> | budować |
| <i class = "material-icons custom"> w pamięci podręcznej </i> | w pamięci podręcznej |
| <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> | zmieniać historię |
| <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"> class </i> | klasa |
| <i class = "material-icons custom"> kod </i> | kod |
| <i class = "material-icons custom"> karta_kredytowa </i> | karta kredytowa |
| <i class = "material-icons custom"> pulpit nawigacyjny </i> | deska rozdzielcza |
| <i class = "material-icons custom"> usuń </i> | usunąć |
| <i class = "material-icons custom"> opis </i> | opis |
| <i class = "material-icons custom"> dns </i> | dns |
| <i class = "material-icons custom"> gotowe </i> | Gotowe |
| <i class = "material-icons custom"> done_all </i> | wszystko zrobione |
| <i class = "material-icons custom"> wysuń </i> | wyrzucać |
| <i class = "material-icons custom"> wydarzenie </i> | zdarzenie |
| <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"> eksploruj </i> | badać |
| <i class = "material-icons custom"> rozszerzenie </i> | rozbudowa |
| <i class = "material-icons custom"> twarz </i> | Twarz |
| <i class = "material-icons custom"> ulubione </i> | ulubiony |
| <i class = "material-icons custom"> favourite_border </i> | ulubione_granice |
| <i class = "material-icons custom"> opinia </i> | sprzężenie zwrotne |
| <i class = "material-icons custom"> find_in_page </i> | Znajdź na stronie |
| <i class = "material-icons custom"> find_replace </i> | znaleźć zamiennik |
| <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> | Ściągnij aplikację |
| <i class = "material-icons custom"> gif </i> | gif |
| <i class = "material-icons custom"> klasa </i> | stopień |
| <i class = "material-icons custom"> group_work </i> | Praca grupowa |
| <i class = "material-icons custom"> pomoc </i> | Wsparcie |
| <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"> historia </i> | historia |
| <i class = "material-icons custom"> strona główna </i> | Dom |
| <i class = "material-icons custom"> hourglass_empty </i> | hourglass_empty |
| <i class = "material-icons custom"> hourglass_full </i> | hourglass_full |
| <i class = "material-icons custom"> http </i> | http |
| <i class = "material-icons custom"> https </i> | https |
| <i class = "material-icons custom"> informacje </i> | info |
| <i class = "material-icons custom"> info_outline </i> | info_outline |
| <i class = "material-icons custom"> dane wejściowe </i> | Wejście |
| <i class = "material-icons custom"> invert_colors </i> | Odwróć kolory |
| <i class = "material-icons custom"> etykieta </i> | etykieta |
| <i class = "material-icons custom"> label_outline </i> | label_outline |
| <i class = "material-icons custom"> język </i> | język |
| <i class = "material-icons custom"> uruchom </i> | uruchomić |
| <i class = "material-icons custom"> lista </i> | lista |
| <i class = "material-icons custom"> blokada </i> | zamek |
| <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"> lojalność </i> | lojalność |
| <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> | Otwórz w przeglądarce |
| <i class = "material-icons custom"> open_in_new </i> | open_in_new |
| <i class = "material-icons custom"> open_with </i> | otwierać z |
| <i class = "material-icons custom"> odsłona strony </i> | widok strony |
| <i class = "material-icons custom"> płatność </i> | Zapłata |
| <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> | Obrazek w obrazku |
| <i class = "material-icons custom"> play_for_work </i> | play_for_work |
| <i class = "material-icons custom"> polimer </i> | polimer |
| <i class = "material-icons custom"> power_settings_new </i> | power_settings_new |
| <i class = "material-icons custom"> drukuj </i> | wydrukować |
| <i class = "material-icons custom"> query_builder </i> | query_builder |
| <i class = "material-icons custom"> question_answer </i> | pytanie odpowiedź |
| <i class = "material-icons custom"> pokwitowanie </i> | paragon |
| <i class = "material-icons custom"> zrealizuj </i> | wykupić |
| <i class = "material-icons custom"> zmień kolejność </i> | zmienić kolejność |
| <i class = "material-icons custom"> report_problem </i> | Zgłoś problem |
| <i class = "material-icons custom"> przywróć </i> | przywracać |
| <i class = "material-icons custom"> pokój </i> | Pokój |
| <i class = "material-icons custom"> harmonogram </i> | harmonogram |
| <i class = "material-icons custom"> wyszukiwanie </i> | Szukaj |
| <i class = "material-icons custom"> ustawienia </i> | ustawienia |
| <i class = "material-icons custom"> settings_applications </i> | ustawienia_aplikacje |
| <i class = "material-icons custom"> settings_bluetooth </i> | settings_bluetooth |
| <i class = "material-icons custom"> settings_brightness </i> | ustawienia_jasności |
| <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"> sklep </i> | sklep |
| <i class = "material-icons custom"> shop_two </i> | shop_two |
| <i class = "material-icons custom"> shopping_basket </i> | koszyk na zakupy |
| <i class = "material-icons custom"> shopping_cart </i> | wózek sklepowy |
| <i class = "material-icons custom"> speaker_notes </i> | speaker_notes |
| <i class = "material-icons custom"> sprawdzanie pisowni </i> | sprawdzanie pisowni |
| <i class = "material-icons custom"> star_rate </i> | star_rate |
| <i class = "material-icons custom"> gwiazdki </i> | gwiazdy |
| <i class = "material-icons custom"> sklep </i> | sklep |
| <i class = "material-icons custom"> temat </i> | Przedmiot |
| <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"> karta </i> | patka |
| <i class = "material-icons custom"> tab_unselected </i> | tab_unselected |
| <i class = "material-icons custom"> kina </i> | teatry |
| <i class = "material-icons custom"> thumb_down </i> | kciuk w dół |
| <i class = "material-icons custom"> thumb_up </i> | kciuk w górę |
| <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"> dzisiaj </i> | dzisiaj |
| <i class = "material-icons custom"> opłata </i> | myto |
| <i class = "material-icons custom"> track_changes </i> | śledzenie zmian |
| <i class = "material-icons custom"> przetłumacz </i> | Tłumaczyć |
| <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> | zweryfikowany_użytkownik |
| <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"> kolumna_widoku </i> | kolumna_widoku |
| <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"> widoczność </i> | widoczność |
| <i class = "material-icons custom"> visibility_off </i> | visibility_off |
| <i class = "material-icons custom"> praca </i> | praca |
| <i class = "material-icons custom"> youtube_searched_for </i> | youtube_searched_for |
| <i class = "material-icons custom"> zoom_in </i> | zbliżenie |
| <i class = "material-icons custom"> zoom_out </i> | zoom_out |