材质-通知图标

本章介绍了 Google 的（Material）通知图标的用法。假设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 的（Material）通知图标的用法和结果。将上述程序的 <body> 标记替换为表中给出的代码以获得相应的输出 -

用法 结果
<i class="material-icons custom">adb</i> 亚行
<i class="material-icons custom">airline_seat_flat</i> 航空公司座位_平面
<i class="material-icons custom">airline_seat_flat_angled</i> 航空公司座位平面角度
<i class="material-icons custom">airline_seat_individual_suite</i> 航空公司_座位_个人_套房
<i class="material-icons custom">airline_seat_legroom_reduced</i> Airlines_seat_legroom_reduced
<i class="material-icons custom">airline_seat_recline_extra</i> 航空公司座位斜倚额外
<i class="material-icons custom">airline_seat_recline_normal</i> Airlines_seat_recline_normal
<i class="material-icons custom">蓝牙音频</i> 蓝牙音频
<i class="material-icons custom">confirmation_number</i> 确认号码
<i class="material-icons custom">disc_full</i> 光盘已满
<i class="material-icons custom">do_not_disturb</i> 请勿打扰
<i class="material-icons custom">do_not_disturb_alt</i> 请勿打扰替代
<i class="material-icons custom">drive_eta</i> 驱动器_eta
<i class="material-icons custom">event_available</i> 事件可用
<i class="material-icons custom">event_busy</i> 事件忙
<i class="material-icons custom">event_note</i> 事件注释
<i class="material-icons custom">folder_special</i> 文件夹_特殊
<i class="material-icons custom">live_tv</i> 电视直播
<i class="material-icons custom">彩信</i> 彩信
<i class="material-icons custom">更多</i> 更多的
<i class="material-icons custom">网络锁定</i> 网络锁定
<i class="material-icons custom">ondemand_video</i> 点播视频
<i class="material-icons custom">个人视频</i> 个人视频
<i class="material-icons custom">phone_bluetooth_speaker</i> 电话蓝牙扬声器
<i class="material-icons custom">电话转发</i> 电话转发
<i class="material-icons custom">phone_in_talk</i> 通话中的电话
<i class="material-icons custom">手机已锁定</i> 电话锁定
<i class="material-icons custom">phone_missed</i> 电话未接
<i class="material-icons custom">phone_paused</i> 电话暂停
<i class="material-icons custom">功率</i> 力量
<i class="material-icons custom">sd_card</i> SD卡
<i class="material-icons custom">sim_card_alert</i> sim_card_alert
<i class="material-icons custom">短信</i> 短信
<i class="material-icons custom">sms_failed</i> 短信失败
<i class="material-icons custom">同步</i> 同步
<i class="material-icons custom">sync_disabled</i> 同步禁用
<i class="material-icons custom">sync_problem</i> 同步问题
<i class="material-icons custom">system_update</i> 系统更新
<i class="material-icons custom">tap_and_play</i> 点击并播放
<i class="material-icons custom">离开时间</i> 是时候走了
<i class="material-icons custom">振动</i> 振动
<i class="material-icons custom">voice_chat</i> 语音聊天
<i class="material-icons custom">vpn_lock</i> VPN_锁
<i class="material-icons custom">厕所</i> 厕所
<i class="material-icons custom">wifi</i> 无线上网