素材-AVアイコン

この章では、Googleの（素材）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の（素材）AVアイコンの使用法と結果を示します。上記のプログラムの<body>タグを表に示されているコードに置き換えて、それぞれの出力を取得します-

使用法	結果
<iclass = "material-iconscustom">エアプレイ</ i>	エアプレイ
<iclass = "material-iconscustom">アルバム</ i>	アルバム
<i class = "material-icons custom"> av_timer </ i>	av_timer
<i class = "material-icons custom"> closed_caption </ i>	字幕
<iclass = "material-iconscustom">イコライザー</ i>	イコライザ
<iclass = "material-iconscustom">明示的</ i>	明示的
<i class = "material-icons custom"> fast_forward </ i>	早送り
<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
<iclass = "material-iconscustom">ゲーム</ i>	ゲーム
<i class = "material-icons custom"> hd </ i>	hd
<iclass = "material-iconscustom">ヒアリング</ i>	聴覚
<i class = "material-icons custom"> high_quality </ i>	高品質
<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
<iclass = "material-iconscustom">ループ</ i>	ループ
<iclass = "material-iconscustom">マイク</ i>	マイク
<i class = "material-icons custom"> mic_none </ i>	mic_none
<i class = "material-icons custom"> mic_off </ i>	mic_off
<iclass = "material-iconscustom">映画</ i>	映画
<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
<iclass = "material-iconscustom">一時停止</ i>	一時停止
<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>	playplay_add
<iclass = "material-iconscustom">キュー</ i>	キュー
<i class = "material-icons custom"> queue_music </ i>	queue_music
<iclass = "material-iconscustom">ラジオ</ i>	無線
<i class = "material-icons custom">最近の俳優</ i>	最近の俳優
<iclass = "material-iconscustom">繰り返し</ i>	繰り返す
<i class = "material-icons custom"> repeat_one </ i>	repeat_one
<iclass = "material-iconscustom">再生</ i>	リプレイ
<iclass = "material-iconscustom">エアプレイ</ i>	replay_10
<i class = "material-icons custom"> replay_30 </ i>	replay_30
<i class = "material-icons custom"> replay_5 </ i>	replay_5
<iclass = "material-iconscustom">シャッフル</ i>	シャッフル
<i class = "material-icons custom"> skip_next </ i>	skip_next
<i class = "material-icons custom"> skip_previous </ i>	skip_previous
<i class = "material-iconscustom">スヌーズ</ i>	スヌーズ
<i class = "material-icons custom"> sort_by_alpha </ i>	sort_by_alpha
<iclass = "material-iconscustom">停止</ i>	やめる
<iclass = "material-iconscustom">字幕</ i>	字幕
<i class = "material-icons custom"> surround_sound </ i>	サラウンドサウンド
<i class = "material-icons custom"> video_library </ i>	video_library
<iclass = "material-iconscustom">ビデオカメラ</ i>	ビデオカメラ
<i class = "material-icons custom"> videocam_off </ i>	videocam_off
<i class = "material-icons custom"> volume_down </ i>	ボリュームダウン
<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-iconscustom">ウェブ</ i>	ウェブ