- 网页图标教程
- Web 图标-主页
- Web 图标 - 简介
- 字体真棒
- 字体真棒图标
- 真棒字体 - 网页图标
- 字体真棒-手形图标
- Font Awesome - 交通图标
- Font Awesome - 性别图标
- Font Awesome - 文件类型图标
- Font Awesome - 旋转图标
- Font Awesome - 表单控件图标
- 字体真棒-付款图标
- Font Awesome - 图表图标
- Font Awesome - 货币图标
- Font Awesome - 文本编辑器图标
- Font Awesome - 方向图标
- Font Awesome - 视频播放器图标
- Font Awesome - 品牌图标
- 字体真棒-医疗图标
- 材质图标
- 材质图标
- 材质-动作图标
- 材料-警报图标
- 材质-AV 图标
- 材料-通信图标
- 材质-内容图标
- 材质-设备图标
- 材质-编辑器图标
- 材质-文件图标
- 材质-硬件图标
- 材质-图像图标
- 材质-地图图标
- 材质-导航图标
- 材质-通知图标
- 材料-社会图标
- 材质 - 切换图标
- Bootstrap 字形
- Bootstrap 字形
- Bootstrap - 组件
- Web 图标有用的资源
- Web 图标 - 快速指南
- 网页图标 - 有用的资源
- Web 图标-讨论
材料-通信图标
本章介绍了 Google 的(Material)通信图标的用法。假设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 的(Material)通信图标的用法和结果。将上述程序的 <body> 标记替换为表中给出的代码以获得相应的输出 -
用法 | 结果 |
---|---|
<i class="material-icons custom">业务</i> | 商业 |
<i class="material-icons custom">通话</i> | 称呼 |
<i class="material-icons custom">call_made</i> | 呼叫已完成 |
<i class="material-icons custom">call_merge</i> | 呼叫合并 |
<i class="material-icons custom">call_missed</i> | 未接来电 |
<i class="material-icons custom">call_received</i> | 已接来电 |
<i class="material-icons custom">call_split</i> | 呼叫分割 |
<i class="material-icons custom">聊天</i> | 聊天 |
<i class="material-icons custom">chat_bubble</i> | 聊天气泡 |
<i class="material-icons custom">chat_bubble_outline</i> | 聊天气泡大纲 |
<i class="material-icons custom">clear_all</i> | 全部清除 |
<i class="material-icons custom">评论</i> | 评论 |
<i class="material-icons custom">contact_phone</i> | 联系电话 |
<i class="material-icons custom">联系人</i> | 联系人 |
<i class="material-icons custom">dialer_sip</i> | dialer_sip |
<i class="material-icons custom">拨号盘</i> | 拨号盘 |
<i class="material-icons custom">论坛</i> | 论坛 |
<i class="material-icons custom">导入_导出</i> | 进出口 |
<i class="material-icons custom">invert_colors_off</i> | 反转颜色关闭 |
<i class="material-icons custom">live_help</i> | 实时帮助 |
<i class="material-icons custom">location_off</i> | 位置关闭 |
<i class="material-icons custom">location_on</i> | 位置_on |
<i class="material-icons custom">消息</i> | 信息 |
<i class="material-icons custom">no_sim</i> | 无SIM卡 |
<i class="material-icons custom">手机</i> | 电话 |
<i class="material-icons custom">phonelink_erase</i> | 电话链接_擦除 |
<i class="material-icons custom">phonelink_lock</i> | 电话链接锁 |
<i class="material-icons custom">phonelink_ring</i> | 电话链接环 |
<i class="material-icons custom">phonelink_setup</i> | 电话链接_设置 |
<i class="material-icons custom">portable_wifi_off</i> | 便携式_wifi_关闭 |
<i class="material-icons custom">present_to_all</i> | 呈现给所有人 |
<i class="material-icons custom">ring_volume</i> | 环体积 |
<i class="material-icons custom">speaker_phone</i> | 扬声器电话 |
<i class="material-icons custom">stay_current_landscape</i> | 保持当前景观 |
<i class="material-icons custom">stay_current_portrait</i> | 保持当前肖像 |
<i class="material-icons custom">stay_primary_landscape</i> | 停留_主要_景观 |
<i class="material-icons custom">stay_primary_portrait</i> | 保持主要肖像 |
<i class="material-icons custom">swap_calls</i> | 交换调用 |
<i class="material-icons custom">短信</i> | 短信 |
<i class="material-icons custom">语音邮件</i> | 语音信箱 |
<i class="material-icons custom">vpn_key</i> | VPN_密钥 |
<i class="material-icons custom">电子邮件</i> | 电子邮件 |
<i class="material-icons custom">call_end</i> | 呼叫结束 |