Matériel - Icônes d'image
Ce chapitre explique l'utilisation des icônes d'image (matérielle) 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 d'image (matérielle) 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"> add_to_photos </i> | add_to_photos |
| <i class = "material-icons custom"> ajuster </i> | régler |
| <i class = "material-icons custom"> assistant </i> | assistant |
| <i class = "material-icons custom"> assistant </i> | assistant |
| <i class = "material-icons custom"> piste audio </i> | piste audio |
| <i class = "material-icons custom"> blur_circular </i> | blur_circular |
| <i class = "material-icons custom"> blur_linear </i> | flou_linéaire |
| <i class = "material-icons custom"> blur_off </i> | blur_off |
| <i class = "material-icons custom"> blur_on </i> | blur_on |
| <i class = "material-icons custom"> luminosité_1 </i> | luminosité_1 |
| <i class = "material-icons custom"> luminosité_2 </i> | luminosité_2 |
| <i class = "material-icons custom"> luminosité_3 </i> | luminosité_3 |
| <i class = "material-icons custom"> luminosité_4 </i> | luminosité_4 |
| <i class = "material-icons custom"> luminosité_5 </i> | luminosité_5 |
| <i class = "material-icons custom"> luminosité_6 </i> | luminosité_6 |
| <i class = "material-icons custom"> luminosité_7 </i> | luminosité_7 |
| <i class = "material-icons custom"> broken_image </i> | broken_image |
| <i class = "material-icons custom"> pinceau </i> | brosse |
| <i class = "material-icons custom"> appareil photo </i> | caméra |
| <i class = "material-icons custom"> camera_alt </i> | camera_alt |
| <i class = "material-icons custom"> camera_front </i> | camera_front |
| <i class = "material-icons custom"> camera_rear </i> | camera_rear |
| <i class = "material-icons custom"> camera_roll </i> | camera_roll |
| <i class = "material-icons custom"> center_focus_strong </i> | center_focus_strong |
| <i class = "material-icons custom"> center_focus_weak </i> | center_focus_weak |
| <i class = "material-icons custom"> collections </i> | collections |
| <i class = "material-icons custom"> collections_bookmark </i> | collections_bookmark |
| <i class = "material-icons custom"> color_lens </i> | color_lens |
| <i class = "material-icons custom"> coloriser </i> | coloriser |
| <i class = "material-icons custom"> comparer </i> | comparer |
| <i class = "material-icons custom"> control_point </i> | point de contrôle |
| <i class = "material-icons custom"> control_point_duplicate </i> | control_point_duplicate |
| <i class = "material-icons custom"> recadrage </i> | surgir |
| <i class = "material-icons custom"> crop_16_9 </i> | crop_16_9 |
| <i class = "material-icons custom"> crop_3_2 </i> | crop_3_2 |
| <i class = "material-icons custom"> crop_5_4 </i> | crop_5_4 |
| <i class = "material-icons custom"> crop_7_5 </i> | crop_7_5 |
| <i class = "material-icons custom"> crop_din </i> | crop_din |
| <i class = "material-icons custom"> crop_free </i> | crop_free |
| <i class = "material-icons custom"> crop_landscape </i> | crop_landscape |
| <i class = "material-icons custom"> crop_original </i> | crop_original |
| <i class = "material-icons custom"> crop_portrait </i> | crop_portrait |
| <i class = "material-icons custom"> crop_square </i> | crop_square |
| <i class = "material-icons custom"> dehaze </i> | déshumidifier |
| <i class = "material-icons custom"> détails </i> | détails |
| <i class = "material-icons custom"> modifier </i> | Éditer |
| <i class = "material-icons custom"> exposition </i> | exposition |
| <i class = "material-icons custom"> exposition_neg_1 </i> | exposition_neg_1 |
| <i class = "material-icons custom"> exposition_plus_1 </i> | exposition_plus_1 |
| <i class = "material-icons custom"> exposition_plus_2 </i> | exposition_plus_2 |
| <i class = "material-icons custom"> exposition_zero </i> | exposition_zero |
| <i class = "material-icons custom"> filtre </i> | filtre |
| <i class = "material-icons custom"> filter_1 </i> | filtre_1 |
| <i class = "material-icons custom"> filter_2 </i> | filtre_2 |
| <i class = "material-icons custom"> filter_3 </i> | filtre_3 |
| <i class = "material-icons custom"> filter_4 </i> | filtre_4 |
| <i class = "material-icons custom"> filter_5 </i> | filter_5 |
| <i class = "material-icons custom"> filter_6 </i> | filtre_6 |
| <i class = "material-icons custom"> filter_7 </i> | filtre_7 |
| <i class = "material-icons custom"> filter_8 </i> | filtre_8 |
| <i class = "material-icons custom"> filter_9 </i> | filtre_9 |
| <i class = "material-icons custom"> filter_9_plus </i> | filter_9_plus |
| <i class = "material-icons custom"> filter_b_and_w </i> | filter_b_and_w |
| <i class = "material-icons custom"> filter_center_focus </i> | filter_center_focus |
| <i class = "material-icons custom"> filter_drama </i> | filter_drama |
| <i class = "material-icons custom"> filter_frames </i> | filter_frames |
| <i class = "material-icons custom"> filter_hdr </i> | filter_hdr |
| <i class = "material-icons custom"> filter_none </i> | filter_none |
| <i class = "material-icons custom"> filter_tilt_shift </i> | filter_tilt_shift |
| <i class = "material-icons custom"> filter_vintage </i> | filter_vintage |
| <i class = "material-icons custom"> flare </i> | éclater |
| <i class = "material-icons custom"> flash_auto </i> | flash_auto |
| <i class = "material-icons custom"> flash_off </i> | Flash désactivé |
| <i class = "material-icons custom"> flash_on </i> | flash_on |
| <i class = "material-icons custom"> flip </i> | retourner |
| <i class = "material-icons custom"> dégradé </i> | pente |
| <i class = "material-icons custom"> grain </i> | grain |
| <i class = "material-icons custom"> grid_off </i> | grid_off |
| <i class = "material-icons custom"> grid_on </i> | grid_on |
| <i class = "material-icons custom"> hdr_off </i> | hdr_off |
| <i class = "material-icons custom"> hdr_on </i> | hdr_on |
| <i class = "material-icons custom"> hdr_strong </i> | hdr_strong |
| <i class = "material-icons custom"> hdr_weak </i> | hdr_weak |
| <i class = "material-icons custom"> guérison </i> | guérison |
| <i class = "material-icons custom"> image </i> | image |
| <i class = "material-icons custom"> image_aspect_ratio </i> | image_aspect_ratio |
| <i class = "material-icons custom"> iso </i> | iso |
| <i class = "material-icons custom"> paysage </i> | paysage |
| <i class = "material-icons custom"> leak_add </i> | leak_add |
| <i class = "material-icons custom"> leak_remove </i> | leak_remove |
| <i class = "material-icons custom"> objectif </i> | lentille |
| <i class = "material-icons custom"> looks </i> | regards |
| <i class = "material-icons custom"> looks_3 </i> | looks_3 |
| <i class = "material-icons custom"> looks_4 </i> | looks_4 |
| <i class = "material-icons custom"> looks_5 </i> | looks_5 |
| <i class = "material-icons custom"> looks_6 </i> | looks_6 |
| <i class = "material-icons custom"> looks_one </i> | looks_one |
| <i class = "material-icons custom"> looks_two </i> | regards_deux |
| <i class = "material-icons custom"> loupe </i> | loupe |
| <i class = "material-icons custom"> monochrome_photos </i> | monochrome_photos |
| <i class = "material-icons custom"> movie_creation </i> | movie_creation |
| <i class = "material-icons custom"> music_note </i> | note de musique |
| <i class = "material-icons custom"> nature </i> | la nature |
| <i class = "material-icons custom"> nature_people </i> | nature_personnes |
| <i class = "material-icons custom"> wb_sunny </i> | wb_sunny |
| <i class = "material-icons custom"> navigate_next </i> | naviguer_next |
| <i class = "material-icons custom"> navigate_before </i> | naviguer_avant |
| <i class = "material-icons custom"> palette </i> | palette |
| <i class = "material-icons custom"> panorama </i> | panorama |
| <i class = "material-icons custom"> panorama_fish_eye </i> | panorama_fish_eye |
| <i class = "material-icons custom"> panorama_horizontal </i> | panorama_horizontal |
| <i class = "material-icons custom"> panorama_vertical </i> | panorama_vertical |
| <i class = "material-icons custom"> panorama_wide_angle </i> | panorama_wide_angle |
| <i class = "material-icons custom"> photo </i> | photo |
| <i class = "material-icons custom"> album_photo </i> | album photo |
| <i class = "material-icons custom"> photo_camera </i> | appareil photo |
| <i class = "material-icons custom"> photothèque </i> | galerie de photos |
| <i class = "material-icons custom"> photo_size_select_actual </i> | photo_size_select_actual |
| <i class = "material-icons custom"> photo_size_select_large </i> | photo_size_select_large |
| <i class = "material-icons custom"> photo_size_select_small </i> | photo_size_select_small |
| <i class = "material-icons custom"> picture_as_pdf </i> | picture_as_pdf |
| <i class = "material-icons custom"> portrait </i> | portrait |
| <i class = "material-icons custom"> remove_red_eye </i> | remove_red_eye |
| <i class = "material-icons custom"> rotate_90_degrees_ccw </i> | rotate_90_degrees_ccw |
| <i class = "material-icons custom"> rotate_left </i> | tourne à gauche |
| <i class = "material-icons custom"> rotate_right </i> | tourner à droite |
| <i class = "material-icons custom"> diaporama </i> | diaporama |
| <i class = "material-icons custom"> redresser </i> | redresser |
| <i class = "material-icons custom"> style </i> | style |
| <i class = "material-icons custom"> switch_camera </i> | switch_camera |
| <i class = "material-icons custom"> switch_video </i> | switch_video |
| <i class = "material-icons custom"> tag_faces </i> | tag_faces |
| <i class = "material-icons custom"> texture </i> | texture |
| <i class = "material-icons custom"> timelapse </i> | laps de temps |
| <i class = "material-icons custom"> minuterie </i> | minuteur |
| <i class = "material-icons custom"> timer_10 </i> | timer_10 |
| <i class = "material-icons custom"> timer_3 </i> | timer_3 |
| <i class = "material-icons custom"> timer_off </i> | timer_off |
| <i class = "material-icons custom"> tonalité </i> | tonalité |
| <i class = "material-icons custom"> transformation </i> | transformer |
| <i class = "material-icons custom"> réglage </i> | régler |
| <i class = "material-icons custom"> view_comfy </i> | view_comfy |
| <i class = "material-icons custom"> view_compact </i> | view_compact |
| <i class = "material-icons custom"> vignette </i> | vignette |
| <i class = "material-icons custom"> wb_auto </i> | wb_auto |
| <i class = "material-icons custom"> wb_cloudy </i> | wb_cloudy |
| <i class = "material-icons custom"> wb_incandescent </i> | wb_incandescent |
| <i class = "material-icons custom"> wb_iridescent </i> | wb_iridescent |