在仿站过程中,网站的iconfont查找非常浪费时间,这里教大家一次性获取网站iconfont的方法

1.打开 开发者工具 在element中搜索font-face,结果如下,复制font-face所在<style>标签内的所有代码

2.将代码粘贴到自己的编辑器上

创建iconfont.css文件,把上图中的style内容复制到文件中,这就是我们的css文件了.

3.下载svg,woff,ttf,eot文件

看到上图中的https://xxx.eot/.woff/.ttf了吗,这是iconfont的下载地址,在网页上输入即可下载到.woff,ttf,eot格式的iconfont文件.这些iconfont文件就是网站所有iconfont图标集合

对于svg,由于svg网页上显示,不是自动下载,我们可以手动复制svg上的内容,粘贴到自己创建的svg文件上面(我是把iconfont官网上下载的svg内容清空,把仿站的svg内容粘贴上去)

4.修改iconfont.css代码

这几个都下载完成,并且在一个文件夹内,我们就可以修改iconfont.css文件中的https路径了,去掉网址,改为如下路径

5.可以测试iconfont了,根据仿站的iconfont使用,比如下图,我们在自己的代码中这么写,发现可以正确显示iconfont图标了

仿站-获取网站的所有iconfont图标的更多相关文章

  1. 仿站技术——获取和使用某些网站的iconfont图标字体

    前言: 很多前端新手在仿一些大型网站的时候经常遇到一个问题:该网站使用了图标字体——iconfont,虽然现在阿里有开源的iconfont库,但是还是没有原网站的效果(本人强迫症但非处女座).所以此文 ...

  2. PHP获取网站图标（favicon.ico）文件

    有的网站源码中加入了这几行代码: <link rel="shortcut icon" href="/favicon.ico" type="ima ...

  3. 如何获取不同网站的favicon默认图标

    参考文章: 1.利用公共api提取任意网站favicon.ico图标 如何读取favicon 根据设置favicon的方式,就有2种读取favicon的方法:   A.默认直接读取网站根目录的favi ...

  4. 再谈获取网站图标Icon

    上一篇文章讨论了一下获取网站图标方法,是通过从根目录直接获取和html解析结合的方式来获取的,并给出了相应的代码示例.这一篇来讨论一个更现成的方法,这个方法是从360导航的页面发现的,在导航页面中点击 ...

  5. mac使用wget下载网站（仿站）

    wget -c -r -np -k -L -p http://www.xxxx.com 参考 wget的安装 http://blog.csdn.net/ssihc0/article/details/7 ...

  6. 获取网站图标Icon

    通常情况下,做网站的都会给自己的网站添加一个Icon,浏览器上一长排的标签页,用Icon来区分就显得更加醒目.现在想找一个没有Icon的网站并不好找,可见没有Icon的网站是多么的业余啊." ...

  7. A：手把手教Wordpress仿站（基础）

    安装源码 需要服务器有php环境(PHP,Mysql,Apeach/Ngnax) 我用的主机宝(环境一键安装工具)   打开后台突然出现这种情况 Briefly unavailable for sch ...

  8. Zencart视频教程 Zencart模板制作教程视频 Zencart仿站教程资料

    Zen Cart是国外一个免费的.界面友好,开放式源码的购物车软件,是目前外贸行业使用最为广泛的网站程序.本仿站技术需要你有一定的html和css基础,易学易懂,一步一步地教你操作和使用Zen Car ...

  9. 使用PHP获取网站Favicon的方法

    使用PHP获取网站Favicon的方法 Jan022014 作者:Jerry Bendy   发布:2014-01-02 23:18   分类:PHP   阅读:4,357 views   20条评论 ...

随机推荐

  1. JuiceSSH：安卓平台免费好用的 SSH 客户端

    为了解决上下班路上或者没带电脑时,查看 Linux 服务器日志或者紧急运维的需求,最终找到了 JuiceSSH 这款软件,强烈推荐给大家. 简介 JuiceSSH 是一个为 Android 打造的全功 ...

  2. Julia基础语法复数和分数

     1.复数   2.分数

  3. 使用python pip安装工具组件包：出现 requests File “<stdin>",line 1 pip install xxx ^ SyntaxError:invalid syntax

    最近想要试试python ,软件安装完成了,但是,import 组件包时,出了问题,一直不得解:安装pycharm 工具感觉麻烦,不想安装那些,只想单纯使用python . 问题复现: 1.Windo ...

  4. react useCallback notice

    多个不同输入框共用一个方法时使用useCallback: params = initParams = {code: "code_test", name: "name_te ...

  5. PHP实现MySQL并发查询

    一般的,一个看似很简单的页面,一次http请求后,到达服务端,穿过Cache层,落到后台后,实际可能会有很多很多的数据查询逻辑!而这些查询实际是不相互依赖的,也即可以同时查询.比如各种用户信息,用户的 ...

  6. 前端JS—显示赋值（一）

    一:js代码必须位于<script>js代码</script> 把js代码放到<body>元素的地步,可以改善显示速度 二:js显示数据 使用 window.ale ...

  7. udp包最大数据长度是多少

    因为udp包头有2个byte用于记录包体长度. 2个byte可表示最大值为: 2^16-1=64K-1=65535    udp包头占8字节, ip包头占20字节, 65535-28 = 65507 ...

  8. tagbar 调到函数定义再跳回

    首先要在源码文件夹下执行 ctags -R * 生成tags文件 齐次要安装 YouCompleteMe ctrl + ] 跳到函数定义 Ctrl-o 和 Ctrl-I 跳回.我试验的只有 Ctrl- ...

  9. from _sqlite3 import * ImportError: DLL load failed: 找不到指定的模块。

    *Error creating Django application: Error on python side. Exit code: 1, err: Traceback (most recent ...

  10. qcow2快照原理

    关键术语:cluster 一个Qcow2 img文件由固定大小的单元组成,该单元称为cluster,默认大小为65536bytes/64Ksector 数据块读写的最小单元,大小为512字节host ...