Matériel - Icônes de contenu

Ce chapitre explique l'utilisation des icônes de contenu (matériel) de Google. Suppose quecustom est le nom de la classe CSS où nous avons défini la taille et la couleur, comme indiqué dans l'exemple ci-dessous.

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

Le tableau suivant contient l'utilisation et les résultats des icônes de contenu (matériel) de Google. Remplacez la balise <body> du programme ci-dessus par le code donné dans le tableau pour obtenir les sorties respectives -

Usage	Résultat
<i class = "material-icons custom"> ajouter </i>	ajouter
<i class = "material-icons custom"> add_box </i>	add_box
<i class = "material-icons custom"> add_circle </i>	add_circle
<i class = "material-icons custom"> add_circle_outline </i>	add_circle_outline
<i class = "material-icons custom"> archive </i>	archiver
<i class = "material-icons custom"> retour arrière </i>	retour arrière
<i class = "material-icons custom"> bloc </i>	bloquer
<i class = "material-icons custom"> effacer </i>	clair
<i class = "material-icons custom"> content_copy </i>	content_copy
<i class = "material-icons custom"> content_cut </i>	content_cut
<i class = "material-icons custom"> content_paste </i>	content_paste
<i class = "material-icons custom"> créer </i>	créer
<i class = "material-icons custom"> brouillons </i>	brouillons
<i class = "material-icons custom"> liste_filtre </i>	filter_list
<i class = "material-icons custom"> indicateur </i>	drapeau
<i class = "material-icons custom"> font_download </i>	font_download
<i class = "material-icons custom"> avant </i>	vers l'avant
<i class = "material-icons custom"> geste </i>	geste
<i class = "material-icons custom"> boîte de réception </i>	boîte de réception
<i class = "material-icons custom"> lien </i>	lien
<i class = "material-icons custom"> courrier </i>	courrier
<i class = "material-icons custom"> markunread </i>	Marquer comme non lu
<i class = "material-icons custom"> refaire </i>	refaire
<i class = "material-icons custom"> supprimer </i>	retirer
<i class = "material-icons custom"> remove_circle </i>	remove_circle
<i class = "material-icons custom"> remove_circle_outline </i>	remove_circle_outline
<i class = "material-icons custom"> réponse </i>	réponse
<i class = "material-icons custom"> reply_all </i>	répondre à tous
<i class = "material-icons custom"> rapport </i>	rapport
<i class = "material-icons custom"> enregistrer </i>	enregistrer
<i class = "material-icons custom"> select_all </i>	tout sélectionner
<i class = "material-icons custom"> envoyer </i>	envoyer
<i class = "material-icons custom"> tri </i>	Trier
<i class = "material-icons custom"> text_format </i>	text_format
<i class = "material-icons custom"> stay_current_portrait </i>	stay_current_portrait
<i class = "material-icons custom"> annuler </i>	annuler