上一节:
下一节:

  Web Icon - Material - 设备图标

  • 简述

    本章向您介绍 Google 的（材料）设备图标的用法。假设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 的（材料）设备图标的使用情况和结果。
    Usage Result
    <i class="material-icons custom">access_alarm</i> access_alarm
    <i class="material-icons custom">access_alarms</i> access_alarms
    <i class="material-icons custom">access_time</i> access_time
    <i class="material-icons custom">add_alarm</i> add_alarm
    <i class="material-icons custom">airplanemode_active</i> airplanemode_active
    <i class="material-icons custom">airplanemode_inactive</i> airplanemode_inactive
    <i class="material-icons custom">battery_alert</i> battery_alert
    <i class="material-icons custom">battery_charging_full</i> battery_charging_full
    <i class="material-icons custom">battery_full</i> battery_full
    <i class="material-icons custom">battery_std</i> battery_std
    <i class="material-icons custom">battery_unknown</i> battery_unknown
    <i class="material-icons custom">bluetooth</i> bluetooth
    <i class="material-icons custom">bluetooth_connected</i> bluetooth_connected
    <i class="material-icons custom">bluetooth_disabled</i> bluetooth_disabled
    <i class="material-icons custom">bluetooth_searching</i> bluetooth_searching
    <i class="material-icons custom">brightness_auto</i> brightness_auto
    <i class="material-icons custom">brightness_high</i> brightness_high
    <i class="material-icons custom">brightness_low</i> brightness_low
    <i class="material-icons custom">brightness_medium</i> brightness_medium
    <i class="material-icons custom">data_usage</i> data_usage
    <i class="material-icons custom">developer_mode</i> developer_mode
    <i class="material-icons custom">devices</i> devices
    <i class="material-icons custom">dvr</i> dvr
    <i class="material-icons custom">gps_fixed</i> gps_fixed
    <i class="material-icons custom">gps_not_fixed</i> gps_not_fixed
    <i class="material-icons custom">gps_off</i> gps_off
    <i class="material-icons custom">graphic_eq</i> graphic_eq
    <i class="material-icons custom">location_disabled</i> location_disabled
    <i class="material-icons custom">location_searching</i> location_searching
    <i class="material-icons custom">network_cell</i> network_cell
    <i class="material-icons custom">network_wifi</i> network_wifi
    <i class="material-icons custom">screen_lock_landscape</i> screen_lock_landscape
    <i class="material-icons custom">screen_lock_portrait</i> screen_lock_portrait
    <i class="material-icons custom">screen_lock_rotation</i> screen_lock_rotation
    <i class="material-icons custom">screen_rotation</i> screen_rotation
    <i class="material-icons custom">sd_storage</i> sd_storage
    <i class="material-icons custom">settings_system_daydream</i> settings_system_daydream
    <i class="material-icons custom">signal_cellular_4_bar</i> signal_cellular_4_bar
    <i class="material-icons custom">wifi_tethering</i> wifi_tethering
    <i class="material-icons custom">signal_cellular_no_sim</i> signal_cellular_no_sim
    <i class="material-icons custom">signal_cellular_null</i> signal_cellular_null
    <i class="material-icons custom">signal_cellular_off</i> signal_cellular_off
    <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> signal_wifi_off
    <i class="material-icons custom">storage</i> storage
    <i class="material-icons custom">usb</i> usb
    <i class="material-icons custom">wallpaper</i> wallpaper
    <i class="material-icons custom">widgets</i> widgets
    <i class="material-icons custom">wifi_lock</i> wifi_lock
    <i class="material-icons custom">signal_cellular_connected_no_internet_4_bar</i> signal_cellular_connected_no_internet_4_bar
上一节:
下一节: