Material - Iconos sociales
Este capítulo explica el uso de los iconos sociales (materiales) de Google. Asumir quecustom es el nombre de la clase CSS donde definimos el tamaño y el color, como se muestra en el ejemplo que se muestra a continuación.
<!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>
La siguiente tabla contiene el uso y los resultados de los íconos sociales (materiales) de Google. Reemplace la etiqueta <body> del programa anterior con el código dado en la tabla para obtener las salidas respectivas -
Uso | Resultado |
---|---|
<i class = "material-icons custom"> pastel </i> | pastel |
<i class = "material-icons custom"> dominio </i> | dominio |
<i class = "material-icons custom"> grupo </i> | grupo |
<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"> estado de ánimo </i> | estado animico |
<i class = "material-icons custom"> mood_bad </i> | mal humor |
<i class = "material-icons custom"> notificaciones </i> | notificaciones |
<i class = "material-icons custom"> notificaciones_activas </i> | notificaciones_activas |
<i class = "material-icons custom"> notificaciones_none </i> | notificaciones_none |
<i class = "material-icons custom"> notificaciones_off </i> | notificaciones_off |
<i class = "material-icons custom"> notificaciones_pausadas </i> | notificaciones_pausado |
<i class = "material-icons custom"> páginas </i> | paginas |
<i class = "material-icons custom"> modo_fiesta </i> | modo fiesta |
<i class = "material-icons custom"> personas </i> | personas |
<i class = "material-icons custom"> people_outline </i> | people_outline |
<i class = "material-icons custom"> persona </i> | persona |
<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> | mas uno |
<i class = "material-icons custom"> encuesta </i> | encuesta |
<i class = "material-icons custom"> público </i> | público |
<i class = "material-icons custom"> escuela </i> | colegio |
<i class = "material-icons custom"> compartir </i> | compartir |
<i class = "material-icons custom"> whatshot </i> | Que calor |