Malzeme - Dosya Simgeleri

Bu bölüm, Google'ın (Malzeme) Dosya simgelerinin kullanımını açıklamaktadır. Varsayalım kicustom aşağıda verilen örnekte gösterildiği gibi boyut ve rengi tanımladığımız CSS sınıf adıdır.

<!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>

Aşağıdaki tablo, Google'ın (Materyal) Dosya simgelerinin kullanımını ve sonuçlarını içerir. İlgili çıktıları elde etmek için yukarıdaki programın <body> etiketini tabloda verilen kodla değiştirin -

Kullanım	Sonuç
<i class = "material-icons custom"> ek </i>	ek dosya
<i class = "material-icons custom"> bulut </i>	bulut
<i class = "material-icons custom"> cloud_circle </i>	cloud_circle
<i class = "material-icons custom"> cloud_done </i>	cloud_done
<i class = "material-icons custom"> cloud_download </i>	cloud_download
<i class = "material-icons custom"> cloud_off </i>	cloud_off
<i class = "material-icons custom"> cloud_queue </i>	cloud_queue
<i class = "material-icons custom"> cloud_upload </i>	cloud_upload
<i class = "material-icons custom"> file_indirme </i>	dosya indirme
<i class = "material-icons custom"> file_upload </i>	dosya yükleme
<i class = "material-icons custom"> klasör </i>	Klasör
<i class = "material-icons custom"> folder_open </i>	klasör_açık
<i class = "material-icons custom"> klasör paylaştı </i>	klasör paylaştı