Material - Kartensymbole

In diesem Kapitel wird die Verwendung der Google-Symbole (Material) Maps erläutert. Annehmen, dasscustom ist der CSS-Klassenname, in dem wir die Größe und Farbe definiert haben, wie im folgenden Beispiel gezeigt.

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

Die folgende Tabelle enthält die Verwendung und die Ergebnisse der Google-Symbole (Material) Maps. Ersetzen Sie das <body> -Tag des obigen Programms durch den in der Tabelle angegebenen Code, um die entsprechenden Ausgaben zu erhalten -

Verwendung	Ergebnis
<i class = "material-icons custom"> war </ i>	war hier
<i class = "material-icons custom"> Richtungen </ i>	Richtungen
<i class = "material-icons custom"> Richtungen_Bike </ i>	Richtungen_Bike
<i class = "material-icons custom"> Richtungen_Boot </ i>	Richtungen_Boot
<i class = "material-icons custom"> Richtungen_Bus </ i>	richtungen_bus
<i class = "material-icons custom"> direction_car </ i>	richtungen_auto
<i class = "material-icons custom"> direction_railway </ i>	richtungsweg
<i class = "material-icons custom"> Richtungen_Run </ i>	Richtungen_Run
<i class = "material-icons custom"> Richtungen_Unterführung </ i>	Richtungen_Unterbahn
<i class = "material-icons custom"> Richtungen_transit </ i>	Richtungen_transit
<i class = "material-icons custom"> direction_walk </ i>	Richtungen_Weg
<i class = "material-icons custom"> Flug </ i>	Flug
<i class = "material-icons custom"> hotel </ i>	Hotel
<i class = "material-icons custom"> Ebenen </ i>	Schichten
<i class = "material-icons custom"> layer_clear </ i>	schichten_klare
<i class = "material-icons custom"> local_activity </ i>	local_activity
<i class = "material-icons custom"> local_airport </ i>	local_airport
<i class = "material-icons custom"> local_atm </ i>	local_atm
<i class = "material-icons custom"> local_bar </ i>	local_bar
<i class = "material-icons custom"> local_cafe </ i>	local_cafe
<i class = "material-icons custom"> local_car_wash </ i>	local_car_wash
<i class = "material-icons custom"> local_convenience_store </ i>	local_convenience_store
<i class = "material-icons custom"> local_dining </ i>	local_dining
<i class = "material-icons custom"> local_drink </ i>	local_drink
<i class = "material-icons custom"> local_florist </ i>	local_florist
<i class = "material-icons custom"> local_gas_station </ i>	local_gas_station
<i class = "material-icons custom"> local_grocery_store </ i>	local_grocery_store
<i class = "material-icons custom"> local_hospital </ i>	Lokales Krankenhaus
<i class = "material-icons custom"> local_hotel </ i>	local_hotel
<i class = "material-icons custom"> local_laundry_service </ i>	local_laundry_service
<i class = "material-icons custom"> local_library </ i>	örtliche Bibliothek
<i class = "material-icons custom"> local_mall </ i>	local_mall
<i class = "material-icons custom"> local_movies </ i>	local_movies
<i class = "material-icons custom"> local_offer </ i>	local_offer
<i class = "material-icons custom"> local_parking </ i>	local_parking
<i class = "material-icons custom"> local_pharmacy </ i>	local_pharmacy
<i class = "material-icons custom"> local_phone </ i>	local_phone
<i class = "material-icons custom"> local_pizza </ i>	local_pizza
<i class = "material-icons custom"> local_play </ i>	local_play
<i class = "material-icons custom"> local_post_office </ i>	Postamt
<i class = "material-icons custom"> local_printshop </ i>	local_printshop
<i class = "material-icons custom"> local_see </ i>	local_see
<i class = "material-icons custom"> local_shipping </ i>	local_shipping
<i class = "material-icons custom"> local_taxi </ i>	local_taxi
<i class = "material-icons custom"> map </ i>	Karte
<i class = "material-icons custom"> my_location </ i>	mein Standort
<i class = "material-icons custom"> Navigation </ i>	Navigation
<i class = "material-icons custom"> person_pin </ i>	person_pin
<i class = "material-icons custom"> pin_drop </ i>	Stecknadel fallen
<i class = "material-icons custom"> platzieren </ i>	Ort
<i class = "material-icons custom"> rate_review </ i>	rate_review
<i class = "material-icons custom"> restaurant_menu </ i>	Speisekarte
<i class = "material-icons custom"> Satellit </ i>	Satellit
<i class = "material-icons custom"> store_mall_directory </ i>	store_mall_directory
<i class = "material-icons custom"> Verkehr </ i>	der Verkehr
<i class = "material-icons custom"> Gelände </ i>	Terrain