自己做网站怎么使用字体图标(font-awesome图标使用方法)

2018-11-01    来源:学做网站论坛

容器云强势上线!快速搭建集群,上万Linux镜像随意使用

我们做网站时,网站上会有很多的小图标。以前我们会用小图片来制作这些小图标,但这样做有一个缺点:当我们放大页面时,小图片就会出现失真不清楚的问题。

小图片图标:
学做网站论坛使用的小图标

字体图标:
zt

如何解决这样的问题呢?就是使用字体图标来代替小图片图标。下面就是建网站常用的字体图标-font-awesome图标为例,介绍一下如何在自己做网站时使用字体图标。

方法/步骤

  1. 第一步需要在自己的网页中引入font-awesome字体图标文件。方法很简单,只需要将下面的代码粘贴到自己网站头部HTML文件的</head>标签上方即可。(如果不懂HTML,请学习一下html视频教程)
    
    
    <link href="http://netdna.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet">
  2. 在需要显示小图标的位置,使用下面的代码格式进行字体图标的调用。
    
    
    <i class="fa fa-home fa-lg"></i>
  3. 上面只是一个小图标的使用举例代码,不同的字体图标的代码不一样的。详细见:什么是字体图标,怎么用?
  4. 这样,我们在自己建网站时,就可以使用字体图标了,不管再怎么放大,图标都不会变形。

标签: 代码 建网站

版权申明:本站文章部分自网络,如有侵权,请联系:west999com@outlook.com
特别注意:本站所有转载文章言论不代表本站观点!
本站所提供的图片等素材,版权归原作者所有,如需使用,请与原作者联系。

上一篇:如何制作淘宝图片放大镜功能(附代码)

下一篇:网站Form表单实现提交发送到邮箱