手把手教你如何下载大厂页面的字体——开发

在个人学习的商城开发中,有些网上比较好看的字体想要下载该怎么办呢?接下来详细介绍一下
拿小米商城举例:https://www.mi.com/在这里插入图片描述
这个搜素框中的搜索符号其实是一种字体,那么如何来下载这种字体呢?
步骤:
右键——》点击检查——》Network——》Font——》点击一下你要下载的字体——》点击一下date:application
在这里插入图片描述
复制这段文字 。注意:方框中的不要,连逗号都不能要
在这里插入图片描述
到这里结束
在这里插入图片描述

接下来将base64格式的字体信息解码成可用的字体文件
进入这个网址解码:https://www.motobit.com/util/base64-decoder-encoder.asp

在这里插入图片描述

https://blog.csdn.net/hanhanwanghaha宝藏女孩 欢迎您的关注!
欢迎关注微信公众号:宝藏女孩的成长日记
如有转载,请注明出处(如不注明,盗者必究)

选择以上三个选项,就会自动下载一个叫base64.bin的文件,再命名为.otf格式,例如:
在这里插入图片描述
这样我们的字体也就算下载好了。

然后,在你的project(工程)里面可以新建一个font,将上面的文件复制粘贴到里面去,如
在这里插入图片描述
我们去到小米商城页面去拿这个搜索框。
在这里插入图片描述
复制引号里面的东西(这个特殊字体就是刚刚的搜索框)
在这里插入图片描述
测试代码:

<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><style type="text/css">@font-face {font-family:"xiaomiziti";src:url("font/xiaomiziti.otf");}#Jay{font-family: "xiaomiziti";}</style></head><body><div id="Jay"><label for="search">你想搜什么?</label></div></body>
</html>

注意:我在这行代码

<label for="search">你想搜什么?</label>

下面有在这里插入图片描述这个符号

运行效果:

在这里插入图片描述
这样就算是测试成功啦,希望此小文可以对你有帮助!欢迎一键三联哈哈哈
在这里插入图片描述

注意:不可商用,否则侵权。

https://blog.csdn.net/hanhanwanghaha宝藏女孩 欢迎您的关注!
欢迎关注微信公众号:宝藏女孩的成长日记
如有转载,请注明出处(如不注明,盗者必究)

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/568786.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

一篇文章带你实操代码理解盒子模型

https://blog.csdn.net/hanhanwanghaha宝藏女孩 欢迎您的关注&#xff01; 欢迎关注微信公众号&#xff1a;宝藏女孩的成长日记 如有转载&#xff0c;请注明出处&#xff08;如不注明&#xff0c;盗者必究&#xff09; 目录一、盒子模型的几个关键词二、盒子有尺寸&#xff0c;…

CSS中定位(带你实操代码掌握固定定位、绝对定位与相对定位(子绝父相))

https://blog.csdn.net/hanhanwanghaha宝藏女孩 欢迎您的关注&#xff01; 欢迎关注微信公众号&#xff1a;宝藏女孩的成长日记 如有转载&#xff0c;请注明出处&#xff08;如不注明&#xff0c;盗者必究&#xff09; 目录固定定位绝对定位和相对定位子绝父相绝对定位相对定位…

CSS中z-index属性的简单理解

https://blog.csdn.net/hanhanwanghaha宝藏女孩 欢迎您的关注&#xff01; 欢迎关注微信公众号&#xff1a;宝藏女孩的成长日记 如有转载&#xff0c;请注明出处&#xff08;如不注明&#xff0c;盗者必究&#xff09; 总之就是一句话&#xff1a;拥有更高堆叠顺序的元素总是会…

python中pip已经安装好第三方库,但在pycharm中import时还是标红

已经pip安装好第三方库了&#xff0c;但是在pycharm中import还是标红&#xff0c;像下图&#xff1a; 我记得上次重装系统&#xff0c;出现这种情况的时候&#xff0c;我重启一下pycharm就行了&#xff08;但是感觉pycharm一开一关很费时间&#xff09; 还有一个解决办法&…

软工学子带你一起学习工程经济学!献上与工作相关的实用公式(值得一进)

研究经济学的理由就是【为了避免被经济学家欺骗】——琼罗宾逊 以前看见过一句话&#xff1a;大学生的钱是最好赚的。为什么&#xff1f;因为大学生要面子、没有经历过赚钱的心酸以及思想单纯容易被骗。最近一件事情让我感触很深&#xff0c;前几天室友将学校的水果店给投诉了…

Enterprise Architect(EA)画UML之用例图,敲详细讲解+实战举例

目录具体步骤前提准备实战画用例图实战加一绘制“机票预订系统”用例图补充补充一&#xff1a;如何调整整体字体补充二&#xff1a;如何修改边框字体补充三&#xff1a;在关闭Enterprise Architect之后如何打开&#xff1f;在《UML面向对象分析、建模与设计》中学到了用例图&am…

带你一起学习实用计算机英语!(IT行业、四六级党记起来)《软件工程专业英语》第二单元的重点词汇+名词缩写+重难句+软件需求规格说明

英语是全球IT行业的行业语言&#xff0c;英语技能是IT行业最基本的技能之一。因此熟练掌握相关英语技能对于发展职业生涯具有积极的作用。 《软件工程专业英语》适用于高等院校软件工程、计算机科学及其相关专业、软件学院、各类职业信息技术学院和专业培训机构等。 当我拿到《…

商城左侧菜单栏网页模板

https://blog.csdn.net/hanhanwanghaha宝藏女孩 欢迎您的关注&#xff01; 欢迎关注微信公众号&#xff1a;宝藏女孩的成长日记 如有转载&#xff0c;请注明出处&#xff08;如不注明&#xff0c;盗者必究&#xff09; 哈哈哈直接上代码趴&#xff01; 商城左侧菜单栏网页模板…

IntelliJ IDEA 如何导出安卓(Android)apk文件 详细教程

做完一个Android项目之后&#xff0c;如何才能把项目发布到Internet上供别人使用呢&#xff1f;我们需要将自己的程序打包成Android安装包文件–APK&#xff08;AndroidPackage&#xff09;&#xff0c;其后缀名为".apk"。将APK文件直接上传到Android模拟器或Android…

IntelliJ IDEA 如何用 真机 测试安卓(Android)App 实战移动端

目录前言真机测试步骤实战移动端测试前言 https://blog.csdn.net/hanhanwanghaha一个超级无敌可爱的人鸭 欢迎您的关注&#xff01; 欢迎关注微信公众号&#xff1a;宝藏女孩的成长日记 如有转载&#xff0c;请注明出处&#xff08;如不注明&#xff0c;盗者必究&#xff09; 用…

一篇文章带你快速入门JavaScript(实操代码)

目录一、前提简介1.1什么是JavaScript1.2JavaScript和Java语言的区别1.3Html、Css和Javascript1.4Javascript作用二、实操代码2.1Javascript写在本html内2.2Javascript可以写在单独的文件中&#xff08;外联方式&#xff09;2.3实战&#xff1a;点击一个盒子&#xff0c;让另外…

心情再差,也还是要拿起我的 JavaScript 实战重点代码

昨天与国家奖学金失之交臂&#xff0c;伤心的哭了一晚上&#xff0c;生活也还是要继续&#xff0c;抹完了眼泪今天继续干我的JavaScript&#xff01; 目录一、JavaScript的几个常用函数实战下载框制作二、如何获取一个或者多个元素2.1根据ID查找2.2根据class查找2.3根据标签查找…

如何删除github远程仓库?三部搞定!

https://blog.csdn.net/hanhanwanghaha宝藏女孩 欢迎您的关注&#xff01; 欢迎关注微信公众号&#xff1a;宝藏女孩的成长日记 让这个可爱的宝藏女孩在努力的道路上与你一起同行&#xff01; 如有转载&#xff0c;请注明出处&#xff08;如不注明&#xff0c;盗者必究&#xf…

js实战代码系列—周杰伦给你报时间+网页页签制作模板+jQuery初体验

等到下次需要用的时候&#xff0c;可以回来找模板用哈哈哈哈&#xff01; 刚碰jQuery&#xff0c;今天是个好日子&#xff0c;明天继续学jQuery&#xff0c;明天也是个好日子。 https://blog.csdn.net/hanhanwanghaha一个超级无敌可爱的人鸭 欢迎您的关注&#xff01; 欢迎关注…

【资讯】2017年最好的25大发明,你最钟爱哪个?

引言《时代周刊》每年都会评出一份有趣的发明榜单&#xff0c;悉数一年间世界范围内的重大发明。今年的榜单出来后&#xff0c;「得到」作者马徐骏抢先进行了解读。带你一起看看&#xff0c;2017年有哪些发明正在悄然改变我们的生活。1. 阿迪达斯的4D跑鞋——Futurecraft这款鞋…

js实战代码系列—带你玩jQuery带你飞

https://blog.csdn.net/hanhanwanghaha一个超级无敌可爱的人鸭 欢迎您的关注&#xff01; 欢迎关注微信公众号&#xff1a;宝藏女孩的成长日记 如有转载&#xff0c;请注明出处&#xff08;如不注明&#xff0c;盗者必究&#xff09; 目录前言引入库一个简单的自定义动画模板弹…

软工学子与你一起了解资金时间价值 之 复利(利滚利)+ 贷款的基本常识 + 现金流量图 ——《工程经济学》

研究经济学的理由就是【为了避免被经济学家欺骗】——琼罗宾逊 前段时间学校在整治校园贷的事情&#xff0c;这让我想到高利贷&#xff0c;刚好最近在《工程经济学》中讲到复利的知识&#xff0c;花时间用通俗易懂的话来讲解一下 先来看看重点概况 一、现金流量图&#xff1a;…

连接真机开发安卓(Android)移动app MUI框架——混合式开发(一) (敲详细)

从接触安卓开发的第一天起&#xff0c;我想我已经爱上了开发&#xff0c;哈哈哈&#xff0c;愿你我坚持下去的理由都是热爱&#xff0c;共勉&#xff01;这几天没有更新博客&#xff0c;是因为我学习去了&#xff08;没有相见的日子&#xff0c;我在努力哈哈哈&#xff09;。有…

软件测试基础:MantisBT的安装配置及使用——BUG管理工具

这学期学习的移动app测试&#xff0c;真的晕&#xff0c;一门无聊且枯燥的课&#xff0c;但是还是得学&#xff0c;越是无聊&#xff0c;越要当成男朋友来看待&#xff0c;共勉&#xff01;以前用过一个工具禅道还不错&#xff0c;老师还没讲测试的时候就已经用到过一些了&…

连接真机开发安卓(Android)移动app MUI框架——混合式开发(二) 带你项目开发(最新版)

今天是很丧的一天&#xff0c;做什么都提不起兴趣&#xff0c;不知道何时才能做到道家的“无为&#xff0c;而无所不为”&#xff0c;也无法理解范仲淹的“不以物喜不以己悲”。可是再没兴趣&#xff0c;学习还是要继续&#xff01;&#xff01;&#xff01;为了让自己放松&…