|
@@ -54,6 +54,12 @@
|
54
|
54
|
<div class="content unicode" style="display: block;">
|
55
|
55
|
<ul class="icon_lists dib-box">
|
56
|
56
|
|
|
57
|
+ <li class="dib">
|
|
58
|
+ <span class="icon iconfont"></span>
|
|
59
|
+ <div class="name">round_close</div>
|
|
60
|
+ <div class="code-name">&#xe659;</div>
|
|
61
|
+ </li>
|
|
62
|
+
|
57
|
63
|
<li class="dib">
|
58
|
64
|
<span class="icon iconfont"></span>
|
59
|
65
|
<div class="name">music_fill</div>
|
|
@@ -109,10 +115,10 @@
|
109
|
115
|
>@font-face {
|
110
|
116
|
font-family: 'iconfont';
|
111
|
117
|
src:
|
112
|
|
- url('data:application/x-font-woff2;charset=utf-8;base64,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') format('woff2'),
|
113
|
|
- url('iconfont.woff?t=1662186431769') format('woff'),
|
114
|
|
- url('iconfont.ttf?t=1662186431769') format('truetype'),
|
115
|
|
- url('iconfont.svg?t=1662186431769#iconfont') format('svg');
|
|
118
|
+ url('data:application/x-font-woff2;charset=utf-8;base64,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') format('woff2'),
|
|
119
|
+ url('iconfont.woff?t=1662213530243') format('woff'),
|
|
120
|
+ url('iconfont.ttf?t=1662213530243') format('truetype'),
|
|
121
|
+ url('iconfont.svg?t=1662213530243#iconfont') format('svg');
|
116
|
122
|
}
|
117
|
123
|
</code></pre>
|
118
|
124
|
<h3 id="-iconfont-">第二步:定义使用 iconfont 的样式</h3>
|
|
@@ -138,6 +144,15 @@
|
138
|
144
|
<div class="content font-class">
|
139
|
145
|
<ul class="icon_lists dib-box">
|
140
|
146
|
|
|
147
|
+ <li class="dib">
|
|
148
|
+ <span class="icon iconfont icon-roundclose"></span>
|
|
149
|
+ <div class="name">
|
|
150
|
+ round_close
|
|
151
|
+ </div>
|
|
152
|
+ <div class="code-name">.icon-roundclose
|
|
153
|
+ </div>
|
|
154
|
+ </li>
|
|
155
|
+
|
141
|
156
|
<li class="dib">
|
142
|
157
|
<span class="icon iconfont icon-musicfill"></span>
|
143
|
158
|
<div class="name">
|
|
@@ -219,6 +234,14 @@
|
219
|
234
|
<div class="content symbol">
|
220
|
235
|
<ul class="icon_lists dib-box">
|
221
|
236
|
|
|
237
|
+ <li class="dib">
|
|
238
|
+ <svg class="icon svg-icon" aria-hidden="true">
|
|
239
|
+ <use xlink:href="#icon-roundclose"></use>
|
|
240
|
+ </svg>
|
|
241
|
+ <div class="name">round_close</div>
|
|
242
|
+ <div class="code-name">#icon-roundclose</div>
|
|
243
|
+ </li>
|
|
244
|
+
|
222
|
245
|
<li class="dib">
|
223
|
246
|
<svg class="icon svg-icon" aria-hidden="true">
|
224
|
247
|
<use xlink:href="#icon-musicfill"></use>
|