CSS

CSS

icon样式中有没有扫一扫的样式

回复

MakeTan 发起了问题 • 1 人关注 • 0 个回复 • 49 次浏览 • 2017-07-12 11:20 • 来自相关话题

妹子ui使用百度编辑器下拉菜单无法显示

糯米 回复了问题 • 3 人关注 • 3 个回复 • 294 次浏览 • 2017-06-20 00:10 • 来自相关话题

请问如何取消默认的webapp

回复

狡猾的蜂窝煤 发起了问题 • 1 人关注 • 0 个回复 • 68 次浏览 • 2017-06-12 09:52 • 来自相关话题

请问妹子UI有没有这样的样式

糯米 回复了问题 • 2 人关注 • 1 个回复 • 306 次浏览 • 2017-04-13 14:49 • 来自相关话题

amazeUI手机版怎样一行放两个输入框

lyj4532556 回复了问题 • 4 人关注 • 3 个回复 • 1007 次浏览 • 2017-02-13 16:52 • 来自相关话题

关于css 引用无法显示icon 图标的问题

winworm 回复了问题 • 2 人关注 • 2 个回复 • 420 次浏览 • 2017-01-17 12:25 • 来自相关话题

弱弱问一下CSS3的问题

Amaze UI 玲儿 回复了问题 • 2 人关注 • 1 个回复 • 315 次浏览 • 2016-12-19 14:19 • 来自相关话题

p标签默认会1rem的上下边距,在amazeui.css下没有找到出处

长得丑还智障 回复了问题 • 2 人关注 • 1 个回复 • 366 次浏览 • 2016-12-06 17:14 • 来自相关话题

滚动侦测导航(ScrollSpyNav)与导航(Nav)和导航条(Topbar)激活样式位置不一致

江鸿宾 回复了问题 • 2 人关注 • 3 个回复 • 386 次浏览 • 2016-11-15 22:46 • 来自相关话题

关于am-input-group-label的使用问题

上帝手下一条虫 回复了问题 • 2 人关注 • 2 个回复 • 378 次浏览 • 2016-11-14 13:11 • 来自相关话题

amazeui一进去里面有个DingTalk 这个框架谁做过项目?

Amaze UI 小无 回复了问题 • 3 人关注 • 2 个回复 • 504 次浏览 • 2016-11-01 17:31 • 来自相关话题

微信地图怎么调用呢

Amaze UI 小无 回复了问题 • 2 人关注 • 1 个回复 • 402 次浏览 • 2016-11-01 17:25 • 来自相关话题

自定义AmazeUI的图标

jeeplin 发表了文章 • 2 个评论 • 1374 次浏览 • 2016-07-19 09:53 • 来自相关话题

AmazeUI是国内比较出名一款UI应用,提到UI就有很多小图标,AmazeUI官方发布了很多个小图标。详见:http://amazeui.org/css/icon但一些特殊的场景,美工妹妹会设计很多AmazeUI中没有的图标。而且会经常被使用。本文探讨我们如何把一些把这些图标导入到AmazeUI的图标库中使用?当然如果你想用img标签来引入可以跳过这个教程了。AmazeUI的图标引入方式:下载官方安装包:下载地址-/assets/fonts目录文件夹下就存放这所有已经编辑压缩好的图标库。新手朋友很多有点迷茫,这到底是什么东东呢?其实这些图标我们可以成为字体图标,如果把每一个汉字看成一个图标。那么相对的字体库就是图标集。我们只要把设计好的图标变成字体文件。引入到这些字体库中即可。先看看这些字体库的格式:FontAwesome.otf => OpenType - TrueType 字体, 采用的是 TrueType 曲线, 不过支持 OpenType 的高级特性fontawesome-webfont.eot =>eot字库fontawesome-webfont.svg => 矢量字体图标库fontawesome-webfont.ttf => TrueType 字体, 采用的是 TrueType 曲线, 不支持 OpenType 特性.fontawesome-webfont.woff => Web Open Font Format,简称WOFFfontawesome-webfont.woff2 => woff2新格式的字体图标库你可以通过一些软件打开这些字体库,例如:svg图标你可以通过图标管理进行管理。添加或修改AmazeUI图标文件1、打开ttf文件:推荐使用微软官方的产品:Font Creator Program下载地址:Font Creator Program 2、运行 FCP4.EXT 3、点击文件—>打开—>字体文件—>(选择amazeui的asset/font/fontawesome-webfont.ttf) 打开后会看到很多字体图标文件,当然这就是我们对应与amazeui的图标文件。例如我们看到的第一个图标文件glass,对应的amazeui文件就是<i class="am-icon-glass "></i>4、为了更清楚直观的看到css文件的操作,我们打开 amazeui.css文件。跳到第4707行 我们会看到我们定义的样式am-icon-glass befor这个伪类意思是指在这个样式之前插入,那对应/f000是指什么呢?邮件单击FCP4中的图标,点击“属性”à映射,有一个值和字符名称就找到了我们要找到/f000 5、知道这些后,我们就可以双击图标进行修改,或者插入-->字模,来创建字体,然后在css上配置字体的值即可在网页中显示字体。温馨提示:你可以直接通过ai软件复制矢量图标到FCP4是相当方便的方式。6、还有其他格式的文件,大家可以通过一些在线的转换工具进行转换推荐给大家:http://www.font2web.com/ 上传ttf字体,点击convert&download 即可转换成amazeui的6种字体了。 AmazeUI是国内比较出名一款UI应用,提到UI就有很多小图标,AmazeUI官方发布了很多个小图标。详见:http://amazeui.org/css/icon但一些特殊的场景,美工妹妹会设计很多AmazeUI中没有的图标。而且会经常被使用。本文探讨我们如何把一些把这些图标导入到AmazeUI的图标库中使用?当然如果你想用img标签来引入可以跳过这个教程了。 AmazeUI的图标引入方式:下载官方安装包:下载地址-/assets/fonts目录文件夹下就存放这所有已经编辑压缩好的图标库。新手朋友很多有点迷茫,这到底是什么东东呢?其实这些图标我们可以成为字体图标,如果把每一个汉字看成一个图标。那么相对的字体库就是图标集。我们只要把设计好的图标变成字体文件。引入到这些字体库中即可。先看看这些字体库的格式:FontAwesome.otf => OpenType - TrueType 字体, 采用的是 TrueType 曲线, 不过支持 OpenType 的高级特性fontawesome-webfont.eot =>eot字库fontawesome-webfont.svg => 矢量字体图标库fontawesome-webfont.ttf => TrueType 字体, 采用的是 TrueType 曲线, 不支持 OpenType 特性.fontawesome-webfont.woff => Web Open Font Format,简称WOFFfontawesome-webfont.woff2 => woff2新格式的字体图标库你可以通过一些软件打开这些字体库,例如:svg图标你可以通过图标管理进行管理。 添加或修改AmazeUI图标文件1、打开ttf文件:推荐使用微软官方的产品:Font Creator Program下载地址:Font Creator Program 2、运行 FCP4.EXT 3、点击文件—>打开—>字体文件—>(选择amazeui的asset/font/fontawesome-webfont.ttf) 打开后会看到很多字体图标文件,当然这就是我们对应与amazeui的图标文件。例如我们看到的第一个图标文件glass,对应的amazeui文件就是<i class="am-icon-glass "></i> 4、为了更清楚直观的看到css文件的操作,我们打开 amazeui.css文件。跳到第4707行 我们会看到我们定义的样式am-icon-glass befor这个伪类意思是指在这个样式之前插入,那对应/f000是指什么呢?邮件单击FCP4中的图标,点击“属性”à映射,有一个值和字符名称就找到了我们要找到/f000 5、知道这些后,我们就可以双击图标进行修改,或者插入-->字模,来创建字体,然后在css上配置字体的值即可在网页中显示字体。温馨提示:你可以直接通过ai软件复制矢量图标到FCP4是相当方便的方式。6、还有其他格式的文件,大家可以通过一些在线的转换工具进行转换推荐给大家:http://www.font2web.com/ 上传ttf字体,点击convert&download 即可转换成amazeui的6种字体了。
[ 查看全部 ]
<p>AmazeUI是国内比较出名一款UI应用,提到UI就有很多小图标,AmazeUI官方发布了很多个小图标。详见:http://amazeui.org/css/icon</p><p>但一些特殊的场景,美工妹妹会设计很多AmazeUI中没有的图标。而且会经常被使用。本文探讨我们如何把一些把这些图标导入到AmazeUI的图标库中使用?当然如果你想用img标签来引入可以跳过这个教程了。</p><p>&nbsp;</p><p><strong>AmazeUI的图标引入方式:</strong></p><p>下载官方安装包:<a href="http://cdn.amazeui.org/amazeui ... gt%3B下载地址</a>-/assets/fonts</p><p>目录文件夹下就存放这所有已经编辑压缩好的图标库。新手朋友很多有点迷茫,这到底是什么东东呢?其实这些图标我们可以成为字体图标,如果把每一个汉字看成一个图标。那么相对的字体库就是图标集。我们只要把设计好的图标变成字体文件。引入到这些字体库中即可。</p><p>先看看这些字体库的格式:</p><p>FontAwesome.otf =&gt; OpenType - TrueType 字体, 采用的是 TrueType 曲线, 不过支持 OpenType 的高级特性</p><p>fontawesome-webfont.eot =&gt;eot字库</p><p>fontawesome-webfont.svg =&gt; 矢量字体图标库</p><p>fontawesome-webfont.ttf =&gt; TrueType 字体, 采用的是 TrueType 曲线, 不支持 OpenType 特性.</p><p>fontawesome-webfont.woff =&gt; Web Open Font Format,简称WOFF</p><p>fontawesome-webfont.woff2 =&gt; woff2新格式的字体图标库</p><p>你可以通过一些软件打开这些字体库,</p><p>例如:svg图标你可以通过<a href="https://icomoon.io/app/#/select">图标管理</a>进行管理。</p><p>&nbsp;</p><p><strong>添加或修改AmazeUI图标文件</strong></p><p>1、打开ttf文件:推荐使用微软官方的产品:Font Creator Program</p><p>下载地址:<a href="http://www.pc6.com/softview/So ... BFont Creator Program</a><br />
1.png
</p><p><!--[if gte vml 1]><v:shapetype id="_x0000_t75"
coordsize="21600,21600" o:spt="75" o:preferrelative="t" path="m@4@5l@4@11@9@11@9@5xe"
filled="f" stroked="f">
<v:stroke joinstyle="miter"/>
<v:formulas>
<v:f eqn="if lineDrawn pixelLineWidth 0"/>
<v:f eqn="sum @0 1 0"/>
<v:f eqn="sum 0 0 @1"/>
<v:f eqn="prod @2 1 2"/>
<v:f eqn="prod @3 21600 pixelWidth"/>
<v:f eqn="prod @3 21600 pixelHeight"/>
<v:f eqn="sum @0 0 1"/>
<v:f eqn="prod @6 1 2"/>
<v:f eqn="prod @7 21600 pixelWidth"/>
<v:f eqn="sum @8 21600 0"/>
<v:f eqn="prod @7 21600 pixelHeight"/>
<v:f eqn="sum @10 21600 0"/>
</v:formulas>
<v:path o:extrusionok="f" gradientshapeok="t" o:connecttype="rect"/>
<o:lock v:ext="edit" aspectratio="t"/>
</v:shapetype><v:shape id="图片_x0020_1" o:spid="_x0000_i1029" type="#_x0000_t75"
style='width:330.75pt;height:184.5pt;visibility:visible;mso-wrap-style:square'>
<v:imagedata src="file:///C:\Users\ad\AppData\Local\Temp\msohtmlclip1\01\clip_image001.png"
o:title="G@43A6V%[_V9AQ((WX$R$R6"/>
</v:shape><![endif]--></p><p>2、运行 FCP4.EXT</p><p>
2.png
</p><p><!--[if gte vml 1]><v:shape
id="图片_x0020_2" o:spid="_x0000_i1028" type="#_x0000_t75" style='width:347.25pt;
height:183pt;visibility:visible;mso-wrap-style:square'>
<v:imagedata src="file:///C:\Users\ad\AppData\Local\Temp\msohtmlclip1\01\clip_image003.png"
o:title=""/>
</v:shape><![endif]--></p><p>3、点击文件&mdash;&gt;打开&mdash;&gt;字体文件&mdash;&gt;(选择amazeui的asset/font/fontawesome-webfont.ttf)</p><p>
3.png
<br />打开后会看到很多字体图标文件,当然这就是我们对应与amazeui的图标文件。例如我们看到的第一个图标文件glass,对应的amazeui文件就是</p><p><!--[if gte vml 1]><v:shape
id="图片_x0020_3" o:spid="_x0000_i1027" type="#_x0000_t75" style='width:351.75pt;
height:185.25pt;visibility:visible;mso-wrap-style:square'>
<v:imagedata src="file:///C:\Users\ad\AppData\Local\Temp\msohtmlclip1\01\clip_image005.png"
o:title=""/>
</v:shape><![endif]--></p><p>&lt;i class=&quot;am-icon-glass &quot;&gt;&lt;/i&gt;</p><p>&nbsp;</p><p>4、为了更清楚直观的看到css文件的操作,我们打开 amazeui.css文件。跳到第4707行</p><p>
5.png
<br />我们会看到我们定义的样式<strong>am-icon-glass</strong> befor这个伪类意思是指在这个样式之前插入,那对应/f000是指什么呢?</p><p><!--[if gte vml 1]><v:shape id="图片_x0020_4"
o:spid="_x0000_i1026" type="#_x0000_t75" style='width:462.75pt;height:402.75pt;
visibility:visible;mso-wrap-style:square'>
<v:imagedata src="file:///C:\Users\ad\AppData\Local\Temp\msohtmlclip1\01\clip_image007.png"
o:title="$9P697J@1V0N6Z7V2[DFY(B"/>
</v:shape><![endif]--></p><p>邮件单击FCP4中的图标,点击&ldquo;属性&rdquo;&agrave;映射,有一个值和字符名称就找到了我们要找到/f000</p><p>
1.png
<br />5、知道这些后,我们就可以双击图标进行修改,或者插入--&gt;字模,来创建字体,然后在css上配置字体的值即可在网页中显示字体。温馨提示:你可以直接通过ai软件复制矢量图标到FCP4是相当方便的方式。</p><p><!--[if gte vml 1]><v:shape
id="图片_x0020_6" o:spid="_x0000_i1025" type="#_x0000_t75" style='width:415.5pt;
height:235.5pt;visibility:visible;mso-wrap-style:square'>
<v:imagedata src="file:///C:\Users\ad\AppData\Local\Temp\msohtmlclip1\01\clip_image008.png"
o:title=""/>
</v:shape><![endif]--></p><p>6、还有其他格式的文件,大家可以通过一些在线的转换工具进行转换</p><p>推荐给大家:http://www.font2web.com/ 上传ttf字体,点击convert&amp;download 即可转换成amazeui的6种字体了。</p>

icon样式中有没有扫一扫的样式

回复

MakeTan 发起了问题 • 1 人关注 • 0 个回复 • 49 次浏览 • 2017-07-12 11:20 • 来自相关话题

妹子ui使用百度编辑器下拉菜单无法显示

回复

糯米 回复了问题 • 3 人关注 • 3 个回复 • 294 次浏览 • 2017-06-20 00:10 • 来自相关话题

请问如何取消默认的webapp

回复

狡猾的蜂窝煤 发起了问题 • 1 人关注 • 0 个回复 • 68 次浏览 • 2017-06-12 09:52 • 来自相关话题

请问妹子UI有没有这样的样式

回复

糯米 回复了问题 • 2 人关注 • 1 个回复 • 306 次浏览 • 2017-04-13 14:49 • 来自相关话题

amazeUI手机版怎样一行放两个输入框

回复

lyj4532556 回复了问题 • 4 人关注 • 3 个回复 • 1007 次浏览 • 2017-02-13 16:52 • 来自相关话题

关于css 引用无法显示icon 图标的问题

回复

winworm 回复了问题 • 2 人关注 • 2 个回复 • 420 次浏览 • 2017-01-17 12:25 • 来自相关话题

弱弱问一下CSS3的问题

回复

Amaze UI 玲儿 回复了问题 • 2 人关注 • 1 个回复 • 315 次浏览 • 2016-12-19 14:19 • 来自相关话题

p标签默认会1rem的上下边距,在amazeui.css下没有找到出处

回复

长得丑还智障 回复了问题 • 2 人关注 • 1 个回复 • 366 次浏览 • 2016-12-06 17:14 • 来自相关话题

滚动侦测导航(ScrollSpyNav)与导航(Nav)和导航条(Topbar)激活样式位置不一致

回复

江鸿宾 回复了问题 • 2 人关注 • 3 个回复 • 386 次浏览 • 2016-11-15 22:46 • 来自相关话题

关于am-input-group-label的使用问题

回复

上帝手下一条虫 回复了问题 • 2 人关注 • 2 个回复 • 378 次浏览 • 2016-11-14 13:11 • 来自相关话题

amazeui一进去里面有个DingTalk 这个框架谁做过项目?

回复

Amaze UI 小无 回复了问题 • 3 人关注 • 2 个回复 • 504 次浏览 • 2016-11-01 17:31 • 来自相关话题

微信地图怎么调用呢

回复

Amaze UI 小无 回复了问题 • 2 人关注 • 1 个回复 • 402 次浏览 • 2016-11-01 17:25 • 来自相关话题

自定义AmazeUI的图标

jeeplin 发表了文章 • 2 个评论 • 1374 次浏览 • 2016-07-19 09:53 • 来自相关话题

AmazeUI是国内比较出名一款UI应用,提到UI就有很多小图标,AmazeUI官方发布了很多个小图标。详见:http://amazeui.org/css/icon但一些特殊的场景,美工妹妹会设计很多AmazeUI中没有的图标。而且会经常被使用。本文探讨我们如何把一些把这些图标导入到AmazeUI的图标库中使用?当然如果你想用img标签来引入可以跳过这个教程了。AmazeUI的图标引入方式:下载官方安装包:下载地址-/assets/fonts目录文件夹下就存放这所有已经编辑压缩好的图标库。新手朋友很多有点迷茫,这到底是什么东东呢?其实这些图标我们可以成为字体图标,如果把每一个汉字看成一个图标。那么相对的字体库就是图标集。我们只要把设计好的图标变成字体文件。引入到这些字体库中即可。先看看这些字体库的格式:FontAwesome.otf => OpenType - TrueType 字体, 采用的是 TrueType 曲线, 不过支持 OpenType 的高级特性fontawesome-webfont.eot =>eot字库fontawesome-webfont.svg => 矢量字体图标库fontawesome-webfont.ttf => TrueType 字体, 采用的是 TrueType 曲线, 不支持 OpenType 特性.fontawesome-webfont.woff => Web Open Font Format,简称WOFFfontawesome-webfont.woff2 => woff2新格式的字体图标库你可以通过一些软件打开这些字体库,例如:svg图标你可以通过图标管理进行管理。添加或修改AmazeUI图标文件1、打开ttf文件:推荐使用微软官方的产品:Font Creator Program下载地址:Font Creator Program 2、运行 FCP4.EXT 3、点击文件—>打开—>字体文件—>(选择amazeui的asset/font/fontawesome-webfont.ttf) 打开后会看到很多字体图标文件,当然这就是我们对应与amazeui的图标文件。例如我们看到的第一个图标文件glass,对应的amazeui文件就是<i class="am-icon-glass "></i>4、为了更清楚直观的看到css文件的操作,我们打开 amazeui.css文件。跳到第4707行 我们会看到我们定义的样式am-icon-glass befor这个伪类意思是指在这个样式之前插入,那对应/f000是指什么呢?邮件单击FCP4中的图标,点击“属性”à映射,有一个值和字符名称就找到了我们要找到/f000 5、知道这些后,我们就可以双击图标进行修改,或者插入-->字模,来创建字体,然后在css上配置字体的值即可在网页中显示字体。温馨提示:你可以直接通过ai软件复制矢量图标到FCP4是相当方便的方式。6、还有其他格式的文件,大家可以通过一些在线的转换工具进行转换推荐给大家:http://www.font2web.com/ 上传ttf字体,点击convert&download 即可转换成amazeui的6种字体了。 AmazeUI是国内比较出名一款UI应用,提到UI就有很多小图标,AmazeUI官方发布了很多个小图标。详见:http://amazeui.org/css/icon但一些特殊的场景,美工妹妹会设计很多AmazeUI中没有的图标。而且会经常被使用。本文探讨我们如何把一些把这些图标导入到AmazeUI的图标库中使用?当然如果你想用img标签来引入可以跳过这个教程了。 AmazeUI的图标引入方式:下载官方安装包:下载地址-/assets/fonts目录文件夹下就存放这所有已经编辑压缩好的图标库。新手朋友很多有点迷茫,这到底是什么东东呢?其实这些图标我们可以成为字体图标,如果把每一个汉字看成一个图标。那么相对的字体库就是图标集。我们只要把设计好的图标变成字体文件。引入到这些字体库中即可。先看看这些字体库的格式:FontAwesome.otf => OpenType - TrueType 字体, 采用的是 TrueType 曲线, 不过支持 OpenType 的高级特性fontawesome-webfont.eot =>eot字库fontawesome-webfont.svg => 矢量字体图标库fontawesome-webfont.ttf => TrueType 字体, 采用的是 TrueType 曲线, 不支持 OpenType 特性.fontawesome-webfont.woff => Web Open Font Format,简称WOFFfontawesome-webfont.woff2 => woff2新格式的字体图标库你可以通过一些软件打开这些字体库,例如:svg图标你可以通过图标管理进行管理。 添加或修改AmazeUI图标文件1、打开ttf文件:推荐使用微软官方的产品:Font Creator Program下载地址:Font Creator Program 2、运行 FCP4.EXT 3、点击文件—>打开—>字体文件—>(选择amazeui的asset/font/fontawesome-webfont.ttf) 打开后会看到很多字体图标文件,当然这就是我们对应与amazeui的图标文件。例如我们看到的第一个图标文件glass,对应的amazeui文件就是<i class="am-icon-glass "></i> 4、为了更清楚直观的看到css文件的操作,我们打开 amazeui.css文件。跳到第4707行 我们会看到我们定义的样式am-icon-glass befor这个伪类意思是指在这个样式之前插入,那对应/f000是指什么呢?邮件单击FCP4中的图标,点击“属性”à映射,有一个值和字符名称就找到了我们要找到/f000 5、知道这些后,我们就可以双击图标进行修改,或者插入-->字模,来创建字体,然后在css上配置字体的值即可在网页中显示字体。温馨提示:你可以直接通过ai软件复制矢量图标到FCP4是相当方便的方式。6、还有其他格式的文件,大家可以通过一些在线的转换工具进行转换推荐给大家:http://www.font2web.com/ 上传ttf字体,点击convert&download 即可转换成amazeui的6种字体了。
[ 查看全部 ]
<p>AmazeUI是国内比较出名一款UI应用,提到UI就有很多小图标,AmazeUI官方发布了很多个小图标。详见:http://amazeui.org/css/icon</p><p>但一些特殊的场景,美工妹妹会设计很多AmazeUI中没有的图标。而且会经常被使用。本文探讨我们如何把一些把这些图标导入到AmazeUI的图标库中使用?当然如果你想用img标签来引入可以跳过这个教程了。</p><p>&nbsp;</p><p><strong>AmazeUI的图标引入方式:</strong></p><p>下载官方安装包:<a href="http://cdn.amazeui.org/amazeui ... gt%3B下载地址</a>-/assets/fonts</p><p>目录文件夹下就存放这所有已经编辑压缩好的图标库。新手朋友很多有点迷茫,这到底是什么东东呢?其实这些图标我们可以成为字体图标,如果把每一个汉字看成一个图标。那么相对的字体库就是图标集。我们只要把设计好的图标变成字体文件。引入到这些字体库中即可。</p><p>先看看这些字体库的格式:</p><p>FontAwesome.otf =&gt; OpenType - TrueType 字体, 采用的是 TrueType 曲线, 不过支持 OpenType 的高级特性</p><p>fontawesome-webfont.eot =&gt;eot字库</p><p>fontawesome-webfont.svg =&gt; 矢量字体图标库</p><p>fontawesome-webfont.ttf =&gt; TrueType 字体, 采用的是 TrueType 曲线, 不支持 OpenType 特性.</p><p>fontawesome-webfont.woff =&gt; Web Open Font Format,简称WOFF</p><p>fontawesome-webfont.woff2 =&gt; woff2新格式的字体图标库</p><p>你可以通过一些软件打开这些字体库,</p><p>例如:svg图标你可以通过<a href="https://icomoon.io/app/#/select">图标管理</a>进行管理。</p><p>&nbsp;</p><p><strong>添加或修改AmazeUI图标文件</strong></p><p>1、打开ttf文件:推荐使用微软官方的产品:Font Creator Program</p><p>下载地址:<a href="http://www.pc6.com/softview/So ... BFont Creator Program</a><br />
1.png
</p><p><!--[if gte vml 1]><v:shapetype id="_x0000_t75"
coordsize="21600,21600" o:spt="75" o:preferrelative="t" path="m@4@5l@4@11@9@11@9@5xe"
filled="f" stroked="f">
<v:stroke joinstyle="miter"/>
<v:formulas>
<v:f eqn="if lineDrawn pixelLineWidth 0"/>
<v:f eqn="sum @0 1 0"/>
<v:f eqn="sum 0 0 @1"/>
<v:f eqn="prod @2 1 2"/>
<v:f eqn="prod @3 21600 pixelWidth"/>
<v:f eqn="prod @3 21600 pixelHeight"/>
<v:f eqn="sum @0 0 1"/>
<v:f eqn="prod @6 1 2"/>
<v:f eqn="prod @7 21600 pixelWidth"/>
<v:f eqn="sum @8 21600 0"/>
<v:f eqn="prod @7 21600 pixelHeight"/>
<v:f eqn="sum @10 21600 0"/>
</v:formulas>
<v:path o:extrusionok="f" gradientshapeok="t" o:connecttype="rect"/>
<o:lock v:ext="edit" aspectratio="t"/>
</v:shapetype><v:shape id="图片_x0020_1" o:spid="_x0000_i1029" type="#_x0000_t75"
style='width:330.75pt;height:184.5pt;visibility:visible;mso-wrap-style:square'>
<v:imagedata src="file:///C:\Users\ad\AppData\Local\Temp\msohtmlclip1\01\clip_image001.png"
o:title="G@43A6V%[_V9AQ((WX$R$R6"/>
</v:shape><![endif]--></p><p>2、运行 FCP4.EXT</p><p>
2.png
</p><p><!--[if gte vml 1]><v:shape
id="图片_x0020_2" o:spid="_x0000_i1028" type="#_x0000_t75" style='width:347.25pt;
height:183pt;visibility:visible;mso-wrap-style:square'>
<v:imagedata src="file:///C:\Users\ad\AppData\Local\Temp\msohtmlclip1\01\clip_image003.png"
o:title=""/>
</v:shape><![endif]--></p><p>3、点击文件&mdash;&gt;打开&mdash;&gt;字体文件&mdash;&gt;(选择amazeui的asset/font/fontawesome-webfont.ttf)</p><p>
3.png
<br />打开后会看到很多字体图标文件,当然这就是我们对应与amazeui的图标文件。例如我们看到的第一个图标文件glass,对应的amazeui文件就是</p><p><!--[if gte vml 1]><v:shape
id="图片_x0020_3" o:spid="_x0000_i1027" type="#_x0000_t75" style='width:351.75pt;
height:185.25pt;visibility:visible;mso-wrap-style:square'>
<v:imagedata src="file:///C:\Users\ad\AppData\Local\Temp\msohtmlclip1\01\clip_image005.png"
o:title=""/>
</v:shape><![endif]--></p><p>&lt;i class=&quot;am-icon-glass &quot;&gt;&lt;/i&gt;</p><p>&nbsp;</p><p>4、为了更清楚直观的看到css文件的操作,我们打开 amazeui.css文件。跳到第4707行</p><p>
5.png
<br />我们会看到我们定义的样式<strong>am-icon-glass</strong> befor这个伪类意思是指在这个样式之前插入,那对应/f000是指什么呢?</p><p><!--[if gte vml 1]><v:shape id="图片_x0020_4"
o:spid="_x0000_i1026" type="#_x0000_t75" style='width:462.75pt;height:402.75pt;
visibility:visible;mso-wrap-style:square'>
<v:imagedata src="file:///C:\Users\ad\AppData\Local\Temp\msohtmlclip1\01\clip_image007.png"
o:title="$9P697J@1V0N6Z7V2[DFY(B"/>
</v:shape><![endif]--></p><p>邮件单击FCP4中的图标,点击&ldquo;属性&rdquo;&agrave;映射,有一个值和字符名称就找到了我们要找到/f000</p><p>
1.png
<br />5、知道这些后,我们就可以双击图标进行修改,或者插入--&gt;字模,来创建字体,然后在css上配置字体的值即可在网页中显示字体。温馨提示:你可以直接通过ai软件复制矢量图标到FCP4是相当方便的方式。</p><p><!--[if gte vml 1]><v:shape
id="图片_x0020_6" o:spid="_x0000_i1025" type="#_x0000_t75" style='width:415.5pt;
height:235.5pt;visibility:visible;mso-wrap-style:square'>
<v:imagedata src="file:///C:\Users\ad\AppData\Local\Temp\msohtmlclip1\01\clip_image008.png"
o:title=""/>
</v:shape><![endif]--></p><p>6、还有其他格式的文件,大家可以通过一些在线的转换工具进行转换</p><p>推荐给大家:http://www.font2web.com/ 上传ttf字体,点击convert&amp;download 即可转换成amazeui的6种字体了。</p>
浏览器默认样式统一,基础样式,网格,表格、表单、按钮及常用组件样式。
http://amazeui.org/css/