Matériel - Icônes de matériel

Ce chapitre explique l'utilisation des icônes de matériel (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 matériel (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"> distribution </i>	jeter
<i class = "material-icons custom"> cast_connected </i>	cast_connected
<i class = "material-icons custom"> ordinateur </i>	ordinateur
<i class = "material-icons custom"> desktop_mac </i>	desktop_mac
<i class = "material-icons custom"> desktop_windows </i>	desktop_windows
<i class = "material-icons custom"> developer_board </i>	developer_board
<i class = "material-icons custom"> device_hub </i>	périphérique_hub
<i class = "material-icons custom"> dock </i>	Dock
<i class = "material-icons custom"> manette de jeu </i>	manette de jeu
<i class = "material-icons custom"> casque </i>	casque
<i class = "material-icons custom"> headset_mic </i>	headset_mic
<i class = "material-icons custom"> clavier </i>	clavier
<i class = "material-icons custom"> keyboard_arrow_down </i>	keyboard_arrow_down
<i class = "material-icons custom"> keyboard_arrow_left </i>	keyboard_arrow_left
<i class = "material-icons custom"> keyboard_arrow_right </i>	keyboard_arrow_right
<i class = "material-icons custom"> keyboard_arrow_up </i>	keyboard_arrow_up
<i class = "material-icons custom"> keyboard_backspace </i>	keyboard_backspace
<i class = "material-icons custom"> keyboard_capslock </i>	keyboard_capslock
<i class = "material-icons custom"> keyboard_hide </i>	keyboard_hide
<i class = "material-icons custom"> keyboard_return </i>	keyboard_return
<i class = "material-icons custom"> keyboard_tab </i>	keyboard_tab
<i class = "material-icons custom"> keyboard_voice </i>	keyboard_voice
<i class = "material-icons custom"> ordinateur portable </i>	portable
<i class = "material-icons custom"> laptop_chromebook </i>	ordinateur portable_chromebook
<i class = "material-icons custom"> laptop_mac </i>	laptop_mac
<i class = "material-icons custom"> Laptop_windows </i>	Laptop_windows
<i class = "material-icons custom"> mémoire </i>	Mémoire
<i class = "material-icons custom"> souris </i>	Souris
<i class = "material-icons custom"> phone_android </i>	phone_android
<i class = "material-icons custom"> phone_iphone </i>	phone_iphone
<i class = "material-icons custom"> lien phonel </i>	lien phono
<i class = "material-icons custom"> phonelink_off </i>	phonelink_off
<i class = "material-icons custom"> power_input </i>	entrée de puissance
<i class = "material-icons custom"> routeur </i>	routeur
<i class = "material-icons custom"> scanner </i>	scanner
<i class = "material-icons custom"> sécurité </i>	Sécurité
<i class = "material-icons custom"> sim_card </i>	carte SIM
<i class = "material-icons custom"> smartphone </i>	téléphone intelligent
<i class = "material-icons custom"> haut-parleur </i>	orateur
<i class = "material-icons custom"> speaker_group </i>	speaker_group
<i class = "material-icons custom"> tablette </i>	tablette
<i class = "material-icons custom"> tablet_android </i>	tablet_android
<i class = "material-icons custom"> tablet_mac </i>	tablet_mac
<i class = "material-icons custom"> jouets </i>	jouets
<i class = "material-icons custom"> tv </i>	la télé
<i class = "material-icons custom"> montre </i>	regarder