Materiale - Icone di azione
Questo capitolo spiega l'utilizzo delle icone di azione (materiale) di Google. Assumilocustom è il nome della classe CSS in cui abbiamo definito la dimensione e il colore, come mostrato nell'esempio riportato di seguito.
<!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>La tabella seguente contiene l'utilizzo e i risultati delle icone di azione (materiale) di Google. Sostituisci il tag <body> del programma precedente con il codice fornito nella tabella per ottenere i rispettivi output -
| Utilizzo | Risultato |
|---|---|
| <i class = "material-icons custom"> 3d_rotation </i> | 3d_rotation |
| <i class = "material-icons custom"> accessibilità </i> | accessibilità |
| <i class = "material-icons custom"> account_balance </i> | account_balance |
| <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"> allarme </i> | allarme |
| <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"> annuncio </i> | annuncio |
| <i class = "material-icons custom"> aspect_ratio </i> | proporzioni |
| <i class = "material-icons custom"> valutazione </i> | valutazione |
| <i class = "material-icons custom"> assegnazione </i> | Incarico |
| <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"> rinnovo automatico </i> | Rinnovo Automatico |
| <i class = "material-icons custom"> backup </i> | backup |
| <i class = "material-icons custom"> book </i> | libro |
| <i class = "material-icons custom"> segnalibro </i> | segnalibro |
| <i class = "material-icons custom"> bookmark_border </i> | bookmark_border |
| <i class = "material-icons custom"> bug_report </i> | riportare un errore |
| <i class = "material-icons custom"> build </i> | costruire |
| <i class = "material-icons custom"> memorizzato nella cache </i> | memorizzato nella cache |
| <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> | cambiare la storia |
| <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> | classe |
| <i class = "material-icons custom"> codice </i> | codice |
| <i class = "material-icons custom"> credit_card </i> | carta di credito |
| <i class = "material-icons custom"> dashboard </i> | pannello di controllo |
| <i class = "material-icons custom"> elimina </i> | Elimina |
| <i class = "material-icons custom"> descrizione </i> | descrizione |
| <i class = "material-icons custom"> dns </i> | dns |
| <i class = "material-icons custom"> fatto </i> | fatto |
| <i class = "material-icons custom"> done_all </i> | fatto_tutto |
| <i class = "material-icons custom"> espelli </i> | espellere |
| <i class = "material-icons custom"> evento </i> | evento |
| <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"> esplora </i> | Esplorare |
| <i class = "material-icons custom"> estensione </i> | estensione |
| <i class = "material-icons custom"> viso </i> | viso |
| <i class = "material-icons custom"> favorite </i> | preferito |
| <i class = "material-icons custom"> favorite_border </i> | preferito_bordo |
| <i class = "material-icons custom"> feedback </i> | risposta |
| <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> | ottieni l'applicazione |
| <i class = "material-icons custom"> gif </i> | gif |
| <i class = "material-icons custom"> grado </i> | grado |
| <i class = "material-icons custom"> group_work </i> | lavoro di gruppo |
| <i class = "material-icons custom"> aiuto </i> | Aiuto |
| <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"> storia </i> | storia |
| <i class = "material-icons custom"> home </i> | casa |
| <i class = "material-icons custom"> hourglass_empty </i> | clessidra_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"> informazioni </i> | Informazioni |
| <i class = "material-icons custom"> info_outline </i> | info_outline |
| <i class = "material-icons custom"> input </i> | ingresso |
| <i class = "material-icons custom"> invert_colors </i> | inverti i colori |
| <i class = "material-icons custom"> etichetta </i> | etichetta |
| <i class = "material-icons custom"> label_outline </i> | label_outline |
| <i class = "material-icons custom"> lingua </i> | linguaggio |
| <i class = "material-icons custom"> lancio </i> | lanciare |
| <i class = "material-icons custom"> elenco </i> | elenco |
| <i class = "material-icons custom"> lucchetto </i> | serratura |
| <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"> lealtà </i> | lealtà |
| <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> | apri nel browser |
| <i class = "material-icons custom"> open_in_new </i> | open_in_new |
| <i class = "material-icons custom"> open_with </i> | aperta con |
| <i class = "material-icons custom"> visualizzazione di pagina </i> | visualizzazione della pagina |
| <i class = "material-icons custom"> pagamento </i> | pagamento |
| <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"> polimero </i> | polimero |
| <i class = "material-icons custom"> power_settings_new </i> | power_settings_new |
| <i class = "material-icons custom"> print </i> | Stampa |
| <i class = "material-icons custom"> query_builder </i> | query_builder |
| <i class = "material-icons custom"> question_answer </i> | domanda risposta |
| <i class = "material-icons custom"> ricevuta </i> | ricevuta |
| <i class = "material-icons custom"> riscatta </i> | riscattare |
| <i class = "material-icons custom"> riordina </i> | riordinare |
| <i class = "material-icons custom"> report_problem </i> | segnala problema |
| <i class = "material-icons custom"> ripristino </i> | ristabilire |
| <i class = "material-icons custom"> room </i> | camera |
| <i class = "material-icons custom"> pianificazione </i> | programma |
| <i class = "material-icons custom"> ricerca </i> | ricerca |
| <i class = "material-icons custom"> impostazioni </i> | impostazioni |
| <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"> negozio </i> | negozio |
| <i class = "material-icons custom"> shop_two </i> | shop_two |
| <i class = "material-icons custom"> shopping_basket </i> | shopping_basket |
| <i class = "material-icons custom"> shopping_cart </i> | carrello della spesa |
| <i class = "material-icons custom"> speaker_notes </i> | speaker_notes |
| <i class = "material-icons custom"> controllo ortografico </i> | controllo ortografico |
| <i class = "material-icons custom"> star_rate </i> | star_rate |
| <i class = "material-icons custom"> stelle </i> | stelle |
| <i class = "material-icons custom"> negozio </i> | negozio |
| <i class = "material-icons custom"> oggetto </i> | soggetto |
| <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"> scheda </i> | tab |
| <i class = "material-icons custom"> tab_unselected </i> | tab_unselected |
| <i class = "material-icons custom"> cinema </i> | teatri |
| <i class = "material-icons custom"> thumb_down </i> | pollice verso |
| <i class = "material-icons custom"> thumb_up </i> | thumb_up |
| <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"> oggi </i> | oggi |
| <i class = "material-icons custom"> pedaggio </i> | Pedaggio |
| <i class = "material-icons custom"> track_changes </i> | tenere traccia delle modifiche |
| <i class = "material-icons custom"> translate </i> | tradurre |
| <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> | trasformato in |
| <i class = "material-icons custom"> verificato_user </i> | utente_verificato |
| <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"> visibilità </i> | visibilità |
| <i class = "material-icons custom"> visibilità_off </i> | visibilità_off |
| <i class = "material-icons custom"> lavoro </i> | lavoro |
| <i class = "material-icons custom"> youtube_searched_for </i> | youtube_searched_for |
| <i class = "material-icons custom"> zoom_in </i> | ingrandire |
| <i class = "material-icons custom"> zoom_out </i> | zoom_out |