Web Icon - Material - AV 图标

  • 简述

    本章介绍了 Google 的(Material)AV 图标的用法。假设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) AV 图标的使用情况和结果。用表中给出的代码替换上述程序的 < body > 标签以获得相应的输出 -
    Usage Result
    <i class="material-icons custom">airplay</i> airplay
    <i class="material-icons custom">album</i> album
    <i class="material-icons custom">av_timer</i> av_timer
    <i class="material-icons custom">closed_caption</i> closed_caption
    <i class="material-icons custom">equalizer</i> equalizer
    <i class="material-icons custom">explicit</i> explicit
    <i class="material-icons custom">fast_forward</i> fast_forward
    <i class="material-icons custom">fast_rewind</i> fast_rewind
    <i class="material-icons custom">forward_10</i> forward_10
    <i class="material-icons custom">forward_30</i> forward_30
    <i class="material-icons custom">forward_5</i> forward_5
    <i class="material-icons custom">games</i> games
    <i class="material-icons custom">hd</i> hd
    <i class="material-icons custom">hearing</i> hearing
    <i class="material-icons custom">high_quality</i> high_quality
    <i class="material-icons custom">library_add</i> library_add
    <i class="material-icons custom">library_books</i> library_books
    <i class="material-icons custom">library_music</i> library_music
    <i class="material-icons custom">loop</i> loop
    <i class="material-icons custom">mic</i> mic
    <i class="material-icons custom">mic_none</i> mic_none
    <i class="material-icons custom">mic_off</i> mic_off
    <i class="material-icons custom">movie</i> movie
    <i class="material-icons custom">pause_circle_outline</i> pause_circle_outline
    <i class="material-icons custom">new_releases</i> new_releases
    <i class="material-icons custom">not_interested</i> not_interested
    <i class="material-icons custom">pause</i> pause
    <i class="material-icons custom">pause_circle_filled</i> pause_circle_filled
    <i class="material-icons custom">play_arrow</i> play_arrow
    <i class="material-icons custom">play_circle_filled</i> play_circle_filled
    <i class="material-icons custom">play_circle_outline</i> play_circle_outline
    <i class="material-icons custom">playlist_add</i> playlist_add
    <i class="material-icons custom">queue</i> queue
    <i class="material-icons custom">queue_music</i> queue_music
    <i class="material-icons custom">radio</i> radio
    <i class="material-icons custom">recent_actors</i> recent_actors
    <i class="material-icons custom">repeat</i> repeat
    <i class="material-icons custom">repeat_one</i> repeat_one
    <i class="material-icons custom">replay</i> replay
    <i class="material-icons custom">airplay</i> replay_10
    <i class="material-icons custom">replay_30</i> replay_30
    <i class="material-icons custom">replay_5</i> replay_5
    <i class="material-icons custom">shuffle</i> shuffle
    <i class="material-icons custom">skip_next</i> skip_next
    <i class="material-icons custom">skip_previous</i> skip_previous
    <i class="material-icons custom">snooze</i> snooze
    <i class="material-icons custom">sort_by_alpha</i> sort_by_alpha
    <i class="material-icons custom">stop</i> stop
    <i class="material-icons custom">subtitles</i> subtitles
    <i class="material-icons custom">surround_sound</i> surround_sound
    <i class="material-icons custom">video_library</i> video_library
    <i class="material-icons custom">videocam</i> videocam
    <i class="material-icons custom">videocam_off</i> videocam_off
    <i class="material-icons custom">volume_down</i> volume_down
    <i class="material-icons custom">volume_mute</i> volume_mute
    <i class="material-icons custom">volume_off</i> volume_off
    <i class="material-icons custom">volume_up</i> volume_up
    <i class="material-icons custom">web</i> web