想要使用可以在:

https://www.iconfont.cn/webfont?spm=a313x.7781069.1998910419.d81ec59f2#!/webfont/index  :是web字体

https://www.iconfont.cn/collections/index?spm=a313x.7781068.0.0&type=3    :是字体图标

下载

字体图标和web字体都是下载了那个那个可以用:比如这些字体只有我下载的这几个字才有web字体的效果

1.web字体

1.1.html

1

2

毕业前最后一节课,老师对学生说:“我再看看你们。”

即将说再见,老师不舍,要“再看看”。是啊,人生路那么漫长,可老师能陪伴学生走过的,终究只有一段路。这段路是艰辛的,传道、授业、解惑,都是这条路上必经。老师要对学生们倾囊相授,让学生从不知到知之;要对学生正确引导,让学生不仅学会知识,还要树立正确的人生观、价值观;要对学生倍加关怀,让学生感觉到他们不仅在获得知识,寻求真理,更在得到老师的爱。

“捧着一颗心来,不带半根草去”,这是著名人民教育家陶行知先生的名言,陶行知先生如此,图中的老师如此,普天之下的老师也莫不如此。也因着这一颗心,才有了“我再看看你们”的那份不舍。

当然,除了不舍,还有希冀。

正如图中老师对学生说的那句:“你们再看看书。”

对于老师而言,即将挥手作别的是学生。老师希望学生再看看书,字短情长:再看看书,学生们才能更熟练地掌握所学知识,更好地应对考试,更稳健地走好未来的路。

师生一回,学生们终究要远行,老师能给他们的,是不舍,是希冀,是一场充满爱的目送。

这样充满爱的目送,我一定是拥有过的,可惜的是,在我拥有的时候不曾有太强烈的感受,直到毕业多年,才在回忆中享用。譬如我在大学毕业后回东北故乡探亲的时候,小学班主任远远看见我并喊我名字,说看背影也看得出是自己曾经教过的学生,说这些话的时候,班主任老师眼里满是真挚。

那之后我在反问自己,如果是我远远看到老师的背影,我认得出么?恐怕不能。譬如我的初中语文老师在多年之后托人打听我的手机号码,同我联系,只是想知道我过得怎么样,她说她会为我骄傲,而我呢?接到语文老师电话那一刻,我除了感动,更多的是羞愧,我可能对老师也有一样的牵挂?上述种种,应了一句“当时只道是寻常”,老师对我们那份爱,那份不舍与希冀,总是在分别之后,才被感知。

老师们知道的,是分别时,他们对学生们那一场爱的目送。

老师们不知道的,是分别后,他们也正在或终将成为学生们心中一道爱的风景,随着时光永恒。

今天,因着图中这一场爱的目送,也让我想对曾经教过我的老师说一句:“请让我再看看书,也请让我再看看您!”

21

1.2.css

1 2

5 @font-face{

6 font-family:'webfont';

7 font-display:swap;

8 src:url('../fonts/webfont.eot'); /*IE9*/

9 src:url('../fonts/webfont.eot?#iefix') format('embedded-opentype'),/*IE6-IE8*/

10 url('../fonts/webfont.woff2') format('woff2'),11 url('../fonts/webfont.woff') format('woff'),/*chrome、firefox*/

12 url('../fonts/webfont.ttf') format('truetype'),/*chrome、firefox、opera、Safari, Android, iOS 4.2+*/

13 url('../fonts/webfont.svg#webfont') format('svg'); /*iOS 4.1-*/

14 }

15

16 /*第二步:定义使用 webfont 的样式*/

17 .web-font{

18 font-family:"webfont" !important;

19 font-size:16px;

20 font-style:normal;

21 -webkit-font-smoothing:antialiased;

22 -moz-osx-font-smoothing:grayscale;

23 }

24

25

26

27

2.字体图标

2.1.html

1

2

3

4

5

6

7

8

2.2.css

1 2

4 @font-face{

5 font-family:'iconfont';

6 src:url('../fonts/iconfont.eot');

7 src:url('../fonts/iconfont.eot?#iefix') format('embedded-opentype'),8 url('../fonts/iconfont.woff2') format('woff2'),9 url('../fonts/iconfont.woff') format('woff'),10 url('../fonts/iconfont.ttf') format('truetype'),11 url('../fonts/iconfont.svg#iconfont') format('svg');

12 }

13

14

15 /*第二步:定义使用 iconfont 的样式*/

16 .iconfont{

17 font-family:"iconfont" !important;

18 font-size:16px;

19 font-style:normal;

20 -webkit-font-smoothing:antialiased;

21 -moz-osx-font-smoothing:grayscale;

22

23 margin:1px;

24 }

25

26 /*笑脸*/

27 .smile::before{

28 content:"\e73d";

29 font-size:30px;

30 color:red;

31 }

32 /*消息*/

33 .news::before{

34 content:"\e740";

35 font-size:50px;

36 color:#ccc;

37 }

38 /*喜欢*/

39 .love::before{

40 content:"\e742";

41 }

42 /*我的*/

43 .my::before{

44 content:"\e743";

45 }

46 /*历史*/

47 .history::before{

48 content:"\e745";

49 }

50 /*查找*/

51 .seek::before{

52 content:"\e74b";

53 }

54 /*设置*/

55 .set::before{

56 content:"\e753";

57 }

58

59

1.得自定义生成对应的字体文件的内容

2.使用网络源生成web字体

3.使用

a。定义自定义字体

b。定义样式使用自定义字体

c。指定样式,调用样式

css字号 h5_h5-web字体和字体图标相关推荐

  1. CSS第七天学习总结—— 字体图标

    字体图标 字体图标使用场景: 主要用于显示网页中通用.常用的一些小图标. 一般用<i>标签来写字体图标. 精灵图的缺点: 1.图片文件还是比较大的. 2.图片本身放大和缩小会失真. 3.一 ...

  2. html css图标怎么跟文字并排,CSS高级技巧:精灵图、字体图标、CSS三角做法、CSS用户界面样式、vertical-align属性应用、溢出文字省略号、常见布局技巧...

    CSS高级技巧目录 1.精灵图 使用原因:一个网页往往会有很多小的背景图片作为装饰,为了有效减少接收和发送请求的次数,提供页面加载速度,所以出现了精灵技术.核心原理就是将小图片整合到一张图里,这样浏览 ...

  3. html标题字体重叠,如何在HTML和CSS的段落标题上方显示堆叠的字体超棒图标?

    在下图中,有文字显示为"堆叠的字体 - 真棒图标".这是我想显示堆叠字体的图标的地方.具体来说,我想在方形轮廓内显示一个字体真棒图标(即字体真棒图标),并且可以根据需要调整它的大小 ...

  4. CSS基础(21)_字体样式、图标字体

    字体相关的样式 color            前景色,主要用来设置字体颜色 font-size       字体的大小 em               相当于当前元素的一个字体大小(font-s ...

  5. Zimbra的Web客户端国际字体的控制机制及定制方法

    为什么80%的码农都做不了架构师?>>>    前些日子,在论坛中提出了一个"关于开发Zimbra增补程序的设想",有开客提到如何在Zimbra的Web界面中加入 ...

  6. 计算机字体原理,字体图标生成原理(1)

    浏览器根据font-family解析渲染为不同图形的过程: 1:读取文字内容转换成对应的 unicode码() 计算机操作系统里面每个字符都有一个unicode编码,比如我们在web上输入\u621 ...

  7. html之CSS设计(CSS伪类、优先级、字体属性、背景属性)

    文章目录 一.CSS伪类 二.CSS优先级 三.CSS属性 1.CSS颜色设置 2.颜色属性 3.背景属性 本篇文本主要介绍html编程中的CSS伪类.优先级.字体属性.背景属性,前两种是CSS选择器 ...

  8. div html表格样式设置字体大小,css样式表中如何修改字体大小为18px?

    css样式表中如何修改字体大小为18px?下面本篇文章给大家介绍一下.有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助. css样式表中如何修改字体大小为18px? 在css样式表中可以 ...

  9. CSS3字体和字体图标

    字体和字体图标 1.CSS3嵌入网络字体 1.https://www.dafont.com/ 2.可以通过网站下载自己喜欢的字体 3.在style里面通过@font-face定义这个字体和字体的所在位 ...

  10. 第三章——字体属性,字号、字体、字体粗细、字体样式、字体连写

    文章目录 3.1 常见字体系列 3.2 字体系列/字体类型 3.3 字体大小 3.5 字体粗细 3.6 文字样式 3.7 字体复合属性 字体属性总结 属性 font-size 字号 单位为px像素,一 ...

最新文章

  1. POJ 2828 Buy Tickets | 线段树的喵用
  2. C++11 带来的新特性 (2)—— 统一初始化(Uniform Initialization)
  3. “头移植模型”论文称换头术可行 业内疑两大问题未解
  4. python饼状图颜色一样_Python饼状图的绘制实例
  5. jdk8 字符串_在JDK 8中连接字符串
  6. 1.7Oob 继承关系中构造方法的使用
  7. Android笔记 apk的反编译 | 更新于2017/7/25
  8. html如何动态添加样式表,JavaScript动态插入CSS的方法
  9. 电大本科免考英语和计算机,网络教育本科英语和计算机统考免考条件是什么?...
  10. win7 正在锁定计算机 卡住,win7系统安装卡在正在启动windows界面的解决方法
  11. 北京挪动推出神州行5元卡套餐
  12. notimplementedexception
  13. vue:监听浏览器地址栏变化
  14. 分布式技术原理(一):分布式的三围
  15. 怎么看微信撤回的效果?教你看微信已撤回的消息、图片
  16. python科技新闻爬取
  17. 黄金价格走势软件下载,国内十大现货黄金正规平台排名(2022最新榜单)
  18. m4a怎么转换成mp3格式?
  19. 为何你的浏览器不信任GlobalSign签发的HTTPS证书?
  20. 实时监测文件内容变化,Python

热门文章

  1. 好心情精神心理:睡眠不足,这几点你必须注意!
  2. 【绘图记录】MatplotDraw
  3. 【AP】Robust multi-period portfolio selection(2)
  4. 用KMeans算法实现成绩的预测(并对一些数据进行可视化)
  5. Java抽象类中可以有构造函数吗
  6. 怎么在手机上取消双重认证_手机怎么连到电视上?
  7. 旅游文章合辑,帮你梳理在线旅游市场格局和未来布局,以及移动互联网时代的机遇和挑战
  8. Android App赞赏功能,微信公众号赞赏功能升级为“喜欢作者” 安卓/iOS都可以用...
  9. 前端必备技能~H5网页无法转发给朋友和分享朋友圈,解决方法汇总
  10. android 8 荣耀9,Android 8.0来了!荣耀9/V9用户马上升级