Web入门到精通:font-awesome字体图标

  • font-awesome 字体图标
    在传统的网页制作过程中,涉及图标的情况大多用图片进行处理,图片有优势也有不足。例如,使用图或以字体(如下载字体片会增加总文件的大小并带来很多额外的HTIP请求,增大服务器的负担。并且大量图片需要下载时,也增加了用户的等待时间,牺牲了用户体验。另外,如果图片不是矢量图,在移动端高分辨率显示屏上会变得模糊,因此,在响应式设计中推荐用字体图标来代替图片。字体图标就是将图标字体化,字体通常是矢量的,能解决图片放大模糊的缺点。

  • 自己制作字体图标是非常麻烦的,但我们可以使用font-awesome,它是一款完全开源、免费的字体图标库,提供了将近500个常用图标(并且还在不断更新)。

  • 下载font-awesome
    font-awesome其实就是一个图标工具。我们可以在GitHub上找到 font-awesome项目,将文件下载到本地。解压之后,打开文件夹目录。我们只需关注两个文件夹css 和 fonts,fonts文件夹中有我们需要的字体文件,css文件夹中是该工具提供的css文件。将 fonts 文件和font-awesome.min.css文件复制到chapter02中的css文件目录下。

  • Web入门到精通:font-awesome字体图标_第1张图片

  • 
    
    
        
        
        Document
        
    
    
        
        
    微信公共平台开发

     

 

 

你可能感兴趣的:(tensorflow,人工智能,python,学习,笔记,前端,html)