<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>IconFont</title>
<link rel="stylesheet" href="demo.css">
<script src="iconflow.js"></script>
<style type="text/css">
.icon {
/* 通过设置 font-size 来改变图标大小 */
width: 1em; height: 1em;
/* 图标和文字相邻时,垂直对齐 */
vertical-align: -0.15em;
/* 通过设置 color 来改变 SVG 的颜色/fill */
fill: currentColor;
/* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
normalize.css 中也包含这行 */
overflow: hidden;
}
</style>
</head>
<body>
<div class="main markdown">
<h1>IconFont 图标</h1>
<ul class="icon_lists clear">
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#i-zhizhen1"></use>
</svg>
<div class="name">指针</div>
<div class="fontclass">#i-zhizhen1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#i-msnui-close-fat"></use>
</svg>
<div class="name">关闭</div>
<div class="fontclass">#i-msnui-close-fat</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#i-close"></use>
</svg>
<div class="name">close</div>
<div class="fontclass">#i-close</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#i-wenjiantianjia"></use>
</svg>
<div class="name">文件添加</div>
<div class="fontclass">#i-wenjiantianjia</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#i-tag"></use>
</svg>
<div class="name">tag</div>
<div class="fontclass">#i-tag</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#i-conowredo"></use>
</svg>
<div class="name">conow-redo</div>
<div class="fontclass">#i-conowredo</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#i-conowrevoke"></use>
</svg>
<div class="name">conow-revoke</div>
<div class="fontclass">#i-conowrevoke</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#i-baocun"></use>
</svg>
<div class="name">保存</div>
<div class="fontclass">#i-baocun</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#i-refresh"></use>
</svg>
<div class="name">Refresh</div>
<div class="fontclass">#i-refresh</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#i-youxiashixin"></use>
</svg>
<div class="name">右下-实心</div>
<div class="fontclass">#i-youxiashixin</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#i-paizhaoanniu"></use>
</svg>
<div class="name">拍照按钮</div>
<div class="fontclass">#i-paizhaoanniu</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#i-huizhang"></use>
</svg>
<div class="name">徽章</div>
<div class="fontclass">#i-huizhang</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#i-hrgongzuotai"></use>
</svg>
<div class="name">hr工作台</div>
<div class="fontclass">#i-hrgongzuotai</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#i-tingzhi-copy"></use>
</svg>
<div class="name">停止</div>
<div class="fontclass">#i-tingzhi-copy</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#i-wenjianjia"></use>
</svg>
<div class="name">文件夹</div>
<div class="fontclass">#i-wenjianjia</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#i-webtubiaoku08"></use>
</svg>
<div class="name">声音</div>
<div class="fontclass">#i-webtubiaoku08</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#i-database"></use>
</svg>
<div class="name">数据库</div>
<div class="fontclass">#i-database</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#i-chajian1"></use>
</svg>
<div class="name">插件 (1)</div>
<div class="fontclass">#i-chajian1</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#i-caidan"></use>
</svg>
<div class="name">菜单</div>
<div class="fontclass">#i-caidan</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#i-wangluo"></use>
</svg>
<div class="name">网络</div>
<div class="fontclass">#i-wangluo</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#i-dayin"></use>
</svg>
<div class="name">打印</div>
<div class="fontclass">#i-dayin</div>
</li>
<li>
<svg class="icon" aria-hidden="true">
<use xlink:href="#i-xiantiao-hengxian"></use>
</svg>
<div class="name">线条 - 横线</div>
<div class="fontclass">#i-xiantiao-hengxian</div>
评论0