Материал - значки оборудования
В этой главе объясняется использование значков оборудования Google (Материал). Предположим, чтоcustom - это имя класса CSS, в котором мы определили размер и цвет, как показано в приведенном ниже примере.
<!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>
В следующей таблице содержится информация об использовании и результатах значков (Материального) оборудования Google. Замените тег <body> указанной выше программы кодом, приведенным в таблице, чтобы получить соответствующие выходные данные -
Применение | Результат |
---|---|
<i class = "material-icons custom"> cast </i> | бросать |
<i class = "material-icons custom"> cast_connected </i> | cast_connected |
<i class = "material-icons custom"> компьютер </i> | компьютер |
<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> | device_hub |
<i class = "material-icons custom"> док </i> | док |
<i class = "material-icons custom"> геймпад </i> | геймпад |
<i class = "material-icons custom"> гарнитура </i> | гарнитура |
<i class = "material-icons custom"> headset_mic </i> | headset_mic |
<i class = "material-icons custom"> клавиатура </i> | клавиатура |
<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"> ноутбук </i> | ноутбук |
<i class = "material-icons custom"> laptop_chromebook </i> | laptop_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"> память </i> | объем памяти |
<i class = "material-icons custom"> мышь </i> | мышь |
<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"> телефонная ссылка </i> | телефонная связь |
<i class = "material-icons custom"> phonelink_off </i> | phonelink_off |
<i class = "material-icons custom"> power_input </i> | входная мощность |
<i class = "material-icons custom"> маршрутизатор </i> | маршрутизатор |
<i class = "material-icons custom"> сканер </i> | сканер |
<i class = "material-icons custom"> безопасность </i> | безопасность |
<i class = "material-icons custom"> sim_card </i> | сим-карта |
<i class = "material-icons custom"> смартфон </i> | смартфон |
<i class = "material-icons custom"> динамик </i> | оратор |
<i class = "material-icons custom"> динамик_группа </i> | динамик_группа |
<i class = "material-icons custom"> планшет </i> | планшет |
<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"> игрушки </i> | игрушки |
<i class = "material-icons custom"> телевизор </i> | телевидение |
<i class = "material-icons custom"> часы </i> | часы |