Materi - Ikon Pemberitahuan
Bab ini menjelaskan penggunaan ikon Pemberitahuan (Material) Google. Asumsikan bahwacustom adalah nama kelas CSS tempat kami menentukan ukuran dan warna, seperti yang ditunjukkan pada contoh yang diberikan di bawah ini.
<!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>
Tabel berikut berisi penggunaan dan hasil ikon Notifikasi (Material) Google. Ganti tag <body> dari program di atas dengan kode yang diberikan dalam tabel untuk mendapatkan output masing-masing -
Pemakaian | Hasil |
---|---|
<i class = "material-icons custom"> adb </i> | adb |
<i class = "material-icons custom"> airline_seat_flat </i> | airline_seat_flat |
<i class = "material-icons custom"> airline_seat_flat_angled </i> | airline_seat_flat_angled |
<i class = "material-icons custom"> airline_seat_individual_suite </i> | airline_seat_individual_suite |
<i class = "material-icons custom"> airline_seat_legroom_reduced </i> | airline_seat_legroom_reduced |
<i class = "material-icons custom"> airline_seat_recline_extra </i> | airline_seat_recline_extra |
<i class = "material-icons custom"> airline_seat_recline_normal </i> | airline_seat_recline_normal |
<i class = "material-icons custom"> bluetooth_audio </i> | bluetooth_audio |
<i class = "material-icons custom"> nomor_konfirmasi </i> | Nomor konfirmasi |
<i class = "material-icons custom"> disc_full </i> | disc_full |
<i class = "material-icons custom"> do_not_disturb </i> | jangan ganggu |
<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> | folder_special |
<i class = "material-icons custom"> live_tv </i> | live_tv |
<i class = "material-icons custom"> mms </i> | mms |
<i class = "material-icons custom"> lainnya </i> | lebih |
<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"> daya </i> | kekuasaan |
<i class = "material-icons custom"> sd_card </i> | kartu 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"> sinkronisasi </i> | sinkronisasi |
<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> | Pembaruan sistem |
<i class = "material-icons custom"> tap_and_play </i> | tap_and_play |
<i class = "material-icons custom"> time_to_leave </i> | waktunya pergi |
<i class = "material-icons custom"> getaran </i> | getaran |
<i class = "material-icons custom"> voice_chat </i> | voice_chat |
<i class = "material-icons custom"> vpn_lock </i> | vpn_lock |
<i class = "material-icons custom"> wc </i> | toilet |
<i class = "material-icons custom"> wifi </i> | Wifi |