Materyal - Sosyal Simgeler

Bu bölüm, Google'ın (Materyal) Sosyal 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) Sosyal simgelerinin kullanımını ve sonuçlarını içermektedir. İ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"> pasta </i>	kek
<i class = "material-icons custom"> etki alanı </i>	alan adı
<i class = "material-icons custom"> grup </i>	grup
<i class = "material-icons custom"> group_add </i>	group_add
<i class = "material-icons custom"> location_city </i>	location_city
<i class = "material-icons custom"> ruh hali </i>	ruh hali
<i class = "material-icons custom"> mood_bad </i>	mood_bad
<i class = "material-icons custom"> bildirimler </i>	bildirimler
<i class = "material-icons custom"> bildirimler_aktif </i>	bildirimler_aktif
<i class = "material-icons custom"> notification_none </i>	notification_none
<i class = "material-icons custom"> notification_off </i>	bildirimler_kapalı
<i class = "material-icons custom"> bildirimler_ duraklatıldı </i>	bildirimler_ duraklatıldı
<i class = "material-icons custom"> sayfalar </i>	sayfaları
<i class = "material-icons custom"> party_mode </i>	Parti modu
<i class = "material-icons custom"> insanlar </i>	insanlar
<i class = "material-icons custom"> people_outline </i>	people_outline
<i class = "material-icons custom"> kişi </i>	kişi
<i class = "material-icons custom"> person_add </i>	person_add
<i class = "material-icons custom"> person_outline </i>	person_outline
<i class = "material-icons custom"> plus_one </i>	artı bir
<i class = "material-icons custom"> anket </i>	anket
<i class = "material-icons custom"> genel </i>	halka açık
<i class = "material-icons custom"> okul </i>	okul
<i class = "material-icons custom"> paylaş </i>	Paylaş
<i class = "material-icons custom"> whatshot </i>	ne oldu