Font Awesome

Font Awesome为您提供了可扩展的矢量图标，这些图标可以进行自定义-大小，颜色，阴影以及可以使用CSS强大功能完成的任何操作。

官网：https://www.fontawesome.net/

我根据官网提供的example代码写了个demo。

我直接从官网下载最新的插件项目导入到css中了，好处这样比较方便，坏处是光这一个插件就占用了1.25mb。

插件的使用比较便捷，直接在html的head中引入css即可

<link rel="stylesheet" href="css/font-awesome-4.7.0/css/font-awesome.min.css">

完整demo效果如图，部分图标是动态的。

demo和完整插件下载地址：https://download.csdn.net/download/uvwxyzhao/12726848

要五分，如果没分，可以进官网下载，然后找到example代码，也可以实现。

(html字体图片纯css插件)Font Awesome相关推荐

php动态字体,利用纯CSS实现动态的文字效果实例
相信大家都曾在网站中看到过中效果,一打开页面,无论是文字还是图片,都随着规定时间的而变化,今天我们将介绍如何通过用纯CSS来实现这种效果,下面一起来看看. 大家可能经常会看到酷炫的网站在这类网站中能 ...
css 加载图片,纯CSS图片预加载
译自:[Creating a CSS Image Preloader](http://www.devirtuoso.com/2009/07/creating-a-css-image-preloader ...
无图片纯css实现中国象棋棋子
纯当锻炼前端编程能力了,效果还不错.纯用css不用图片的好处就是加载迅速.代码如下: <!doctype html> <head> <style> .pieces{ ...
html slider图片,纯CSS的Slider
Step1:图片定位 HTML Markup CSS Style .slider-container { position: absolute; width: 100vw; height: 100vh ...
Font Awesome html源码,CSS 中Font Awesome 图标（附码表）
HTML中缩放的矢量图标,您可以使用CSS所提供的所有特性对它们进行更改,包括:大小.颜色.阴影或者其它任何支持的效果. 部分图标: 其他效果图: 调用实例: Font Awesome图标调用实例 N ...
html给radio添加图片,使用纯CSS自定义radio(单选框)和checkbox（多选框）的样式
radio和checkbox由于不同的浏览器显示的样式不一致,因此我们需要自定义radio(单选框)和checkbox(多选框)的样式.基本原理就是贱radio和checkbox的自定义样式设置成图片 ...
纯CSS图片缩放后显示详细信息
哎~!突然好久没更新博客了,最近总在下雨,晚上也经常没有时间来管理博客(目前在敲自己的一个平台,晢时还在写逻辑层的代码),好吧!废话不多说了,言归正传. 现在很多图片缩放的特效大多数都是用javasc ...
css 风琴,玩一下纯 CSS 折腾的一个叫什么手拉风琴的图片展示效果
原标题:玩一下纯 CSS 折腾的一个叫什么手拉风琴的图片展示效果好久没更新的公众号终于更新了,但没有太多内容,主要是也不知道写什么,更关键是已经很久没有写 CSS 的东西了,中午没吃到鸡,就一边观战 ...
CSS 系列七高级技巧篇精灵图、字体图标、CSS三角、图片和文字对齐以及bug 、溢出文字省略号、CSS 初始化、常见的布局技巧
--------------------------- 精灵图 --------------------------- 1.1 为什么需要精灵图一个网页中往往会应用很多小的背景图像作为修饰,当网页中 ...
苹果html5插件,纯CSS打造各种超逼真的苹果（Apple）设备模型
CSSDevices是一款使用纯CSS制作的各种超逼真的苹果(Apple)设备模型.这些CSS苹果设备模型中可以嵌入图片.文字.视频等HTML元素,并且非常容易的就可以制作出轮播图的效果. 使用方法 ...

(html字体图片纯css插件)Font Awesome

Font Awesome

Font Awesome为您提供了可扩展的矢量图标，这些图标可以进行自定义-大小，颜色，阴影以及可以使用CSS强大功能完成的任何操作。

(html字体图片纯css插件)Font Awesome相关推荐

最新文章

热门文章