Materiale - Icone di notifica
Questo capitolo spiega l'utilizzo delle icone di notifica (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 notifica (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"> adb </i> | adb |
<i class = "material-icons custom"> airline_seat_flat </i> | airlines_seat_flat |
<i class = "material-icons custom"> airline_seat_flat_angled </i> | airlines_seat_flat_angled |
<i class = "material-icons custom"> airline_seat_individual_suite </i> | airlines_seat_individual_suite |
<i class = "material-icons custom"> airline_seat_legroom_reduced </i> | airlines_seat_legroom_reduced |
<i class = "material-icons custom"> airline_seat_recline_extra </i> | airlines_seat_recline_extra |
<i class = "material-icons custom"> airline_seat_recline_normal </i> | airlines_seat_recline_normal |
<i class = "material-icons custom"> bluetooth_audio </i> | bluetooth_audio |
<i class = "material-icons custom"> confirm_number </i> | numero di conferma |
<i class = "material-icons custom"> disc_full </i> | disc_full |
<i class = "material-icons custom"> do_not_disturb </i> | non disturbare |
<i class = "material-icons custom"> do_not_disturb_alt </i> | do_not_disturb_alt |
<i class = "material-icons custom"> drive_eta </i> | drive_eta |
<i class = "material-icons custom"> event_available </i> | event_available |
<i class = "material-icons custom"> event_busy </i> | event_busy |
<i class = "material-icons custom"> event_note </i> | event_note |
<i class = "material-icons custom"> folder_special </i> | cartella_special |
<i class = "material-icons custom"> live_tv </i> | tv dal vivo |
<i class = "material-icons custom"> mms </i> | mms |
<i class = "material-icons custom"> altro </i> | Di Più |
<i class = "material-icons custom"> network_locked </i> | network_locked |
<i class = "material-icons custom"> ondemand_video </i> | ondemand_video |
<i class = "material-icons custom"> personal_video </i> | personal_video |
<i class = "material-icons custom"> phone_bluetooth_speaker </i> | phone_bluetooth_speaker |
<i class = "material-icons custom"> phone_forwarded </i> | phone_forwarded |
<i class = "material-icons custom"> phone_in_talk </i> | phone_in_talk |
<i class = "material-icons custom"> phone_locked </i> | phone_locked |
<i class = "material-icons custom"> phone_missed </i> | phone_missed |
<i class = "material-icons custom"> phone_paused </i> | phone_paused |
<i class = "material-icons custom"> potenza </i> | energia |
<i class = "material-icons custom"> sd_card </i> | scheda SD |
<i class = "material-icons custom"> sim_card_alert </i> | sim_card_alert |
<i class = "material-icons custom"> sms </i> | sms |
<i class = "material-icons custom"> sms_failed </i> | sms_failed |
<i class = "material-icons custom"> sincronizzazione </i> | sincronizzazione |
<i class = "material-icons custom"> sync_disabled </i> | sync_disabled |
<i class = "material-icons custom"> sync_problem </i> | sync_problem |
<i class = "material-icons custom"> system_update </i> | aggiornamento del sistema |
<i class = "material-icons custom"> tap_and_play </i> | tap_and_play |
<i class = "material-icons custom"> time_to_leave </i> | tempo di partire |
<i class = "material-icons custom"> vibrazione </i> | vibrazione |
<i class = "material-icons custom"> voice_chat </i> | chat vocale |
<i class = "material-icons custom"> vpn_lock </i> | vpn_lock |
<i class = "material-icons custom"> wc </i> | bagno |
<i class = "material-icons custom"> wifi </i> | Wi-Fi |