材质-设备图标


本章向您介绍 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)设备图标的用法和结果。

用法 结果
<i class="material-icons custom">access_alarm</i> 访问警报
<i class="material-icons custom">access_alarms</i> 访问警报
<i class="material-icons custom">access_time</i> 访问时间
<i class="material-icons custom">add_alarm</i> 添加警报
<i class="material-icons custom">airplanemode_active</i> 飞机模式_活动
<i class="material-icons custom">airplanemode_inactive</i> 飞机模式_非活动状态
<i class="material-icons custom">battery_alert</i> 电池警报
<i class="material-icons custom">battery_charging_full</i> 电池充电已满
<i class="material-icons custom">电池已满</i> 电池充满
<i class="material-icons custom">battery_std</i> 电池标准
<i class="material-icons custom">电池未知</i> 电池_未知
<i class="material-icons custom">蓝牙</i> 蓝牙
<i class="material-icons custom">蓝牙连接</i> 蓝牙连接
<i class="material-icons custom">蓝牙_禁用</i> 蓝牙_禁用
<i class="material-icons custom">蓝牙搜索</i> 蓝牙搜索
<i class="material-icons custom">brightness_auto</i> 亮度自动
<i class="material-icons custom">brightness_high</i> 亮度高
<i class="material-icons custom">亮度_低</i> 亮度_低
<i class="material-icons custom">brightness_medium</i> 亮度_中
<i class="material-icons custom">data_usage</i> 数据使用
<i class="material-icons custom">开发者模式</i> 开发者模式
<i class="material-icons custom">设备</i> 设备
<i class="material-icons custom">dvr</i> 硬盘录像机
<i class="material-icons custom">gps_fixed</i> GPS_固定
<i class="material-icons custom">gps_not_fixed</i> GPS_不_固定
<i class="material-icons custom">gps_off</i> GPS_关闭
<i class="material-icons custom">graphic_eq</i> 图形_eq
<i class="material-icons custom">location_disabled</i> 位置已禁用
<i class="material-icons custom">位置搜索</i> 位置搜索
<i class="material-icons custom">network_cell</i> 网络小区
<i class="material-icons custom">network_wifi</i> 网络_wifi
<i class="material-icons custom">screen_lock_landscape</i> 屏幕锁定风景
<i class="material-icons custom">screen_lock_portrait</i> 屏幕锁定肖像
<i class="material-icons custom">screen_lock_rotation</i> 屏幕锁定旋转
<i class="material-icons custom">屏幕旋转</i> 屏幕旋转
<i class="material-icons custom">sd_storage</i> SD_存储
<i class="material-icons custom">settings_system_daydream</i> 设置_系统_白日梦
<i class="material-icons custom">signal_cellular_4_bar</i> signal_cellular_4_bar
<i class="material-icons custom">wifi_tethering</i> 无线网络共享
<i class="material-icons custom">signal_cellular_no_sim</i> signal_cellular_no_sim
<i class="material-icons custom">signal_cellular_null</i> 信号_蜂窝_空
<i class="material-icons custom">signal_cellular_off</i> 信号_蜂窝_关闭
<i class="material-icons custom">signal_wifi_4_bar</i> signal_wifi_4_bar
<i class="material-icons custom">signal_wifi_4_bar_lock</i> signal_wifi_4_bar_lock
<i class="material-icons custom">signal_wifi_off</i> wifi信号关闭
<i class="material-icons custom">存储</i> 贮存
<i class="material-icons custom">USB</i> USB
<i class="material-icons custom">壁纸</i> 墙纸
<i class="material-icons custom">小部件</i> 小部件
<i class="material-icons custom">wifi_lock</i> 无线网络锁
<i class="material-icons custom">signal_cellular_connected_no_internet_4_bar</i> signal_cellular_connected_no_internet_4_bar