font awesome 页面小图标

前段时间做页面,从网上查找资料,发现了一个好用的工具,就是font awesome奥森图标,使用了一下,发现非常方便,而且很灵活,纯css编写,可以和bootstrap结合使用,网页用上之后,瞬间高大上了,遂推荐一下。


下载地址为:http://download.csdn.net/detail/reinhard_yang/9810959

使用方法很简单,页面引入css文件即可

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

表单元素添加样式即可

<span><i class="fa fa-comment"></i> 哈</span>

样式如图

样式大全:http://www.thinkcmf.com/font/icons#new

应有尽有,基本上可以满足日常所需了,是不是很方便,真可谓居家旅行必备良品。

font awesome 页面小图标的更多相关文章

  1. 添加阿里巴巴图标,让你页面小图标都是CSS3写成

    第一步把你想要的小图标添加到购物车里,然后如图下载 第二步下载完了,如下图有这些文件 第三步,把你需要的必要文件放到文件夹中,然后把需要的代码放到一个CSS中,然后引用 备注,这几个文件就是字体,必须 ...

  2. Web前端开发最佳实践(7):使用合理的技术方案来构建小图标

    大家都对网站上使用的小图标肯定都不陌生,这些小图标作为网站内容的点缀,增加了网站的美观度,提高了用户体验,可是你有没有看过在这些网站中使用的图标都是用什么技术实现的?虽然大部分网站还是使用普通的图片实 ...

  3. 把UI图里的小图标制作成icon font

    一个交互比较多的UI图里面可能会有很多小图标,一般可用sprites图将多个小图标弄成一张大图,或者其它的办法,各种方法的比较可参见博主的另外一篇博客使用css3新属性clip-path制作小图标,本 ...

  4. 浅谈字体小图标font awesome,iconfont,svg各自优缺点

    三种都是矢量图(即放大不失真),但是个自又有个自的优缺点, 1.font awesome: 优点:相对比较简单,查看官网看例子基本上都会用 (http://www.bootcss.com/p/font ...

  5. Font Awesome-用CSS实现各种小图标icon

    Font Awesome为您提供可缩放的矢量图标,您可以使用CSS所提供的所有特性对它们进行更改,包括:大小.颜色.阴影或者其它任何支持的效果.官网:http://fontawesome.dashga ...

  6. Vue.js 使用 Font Awesome 小图标

    1.安装 Font Awesome npm i --save @fortawesome/fontawesome-svg-core npm i --save @fortawesome/free-soli ...

  7. 使用css3新属性clip-path制作小图标

    一般一个网页上面,或多或少都会用到一些小图标,展示这些小图标的方法有很多种.最简单的做法就是将UI图上面的每个小图标都保存为图片,一个小图标就一张图片.但这也是比较笨的方法,因为浏览器同一时间最多加载 ...

  8. 用fontAwesome代替网页icon小图标

    1. 引言 网页小图标到处可见,如果一个网页都是干巴巴的文字和图片,而没有小图标,会显得非常简陋.下面的小图标,你是不是会经常用到? 你可能说——“我们用的都是彩色的,不是黑白的”——别着急,下面会讲 ...

  9. 请用fontAwesome代替网页icon小图标

    1. 引言 网页小图标到处可见,如果一个网页都是干巴巴的文字和图片,而没有小图标,会显得非常简陋.下面的小图标,你是不是会经常用到? 你可能说——“我们用的都是彩色的,不是黑白的”——别着急,下面会讲 ...

随机推荐

  1. Django Form表单组件

    Form介绍 我们之前在HTML页面中利用form表单向后端提交数据时,都会写一些获取用户输入的标签并且用form标签把它们包起来. 与此同时我们在好多场景下都需要对用户的输入做校验,比如校验用户是否 ...

  2. Ubuntu 下生成 python 环境安装文件 requirements.txt

    参考: 查找python项目依赖并生成requirements.txt Ubuntu 下生成 python 环境安装文件 requirements.txt 首先通过 pip 安装pyreqs模块: p ...

  3. .net 去除特殊字符

    str = Regex.Replace(str, @"<script[^>]*?>.*?</script>", "", Regex ...

  4. 【python 3】 列表方法操作汇总

    基础数据类型 : list list主要操作:索引.切片.查询.修改.增加.删除.扩展.统计.排序.获取下标.拷贝…… 1.1  索引  由图: list正向下标从0开始 list反向下标从-1开始 ...

  5. JAVA中的String类(详解)

    Java.lang.String类是final类型的,因此不可以继承这个类.不能修改这个类.String是一个类不属于基本数据类型. 可以从源码中看到,String是一个final类型. String ...

  6. node 之 Buffer 笔记

    1. Buffer 相关 js 最初是被设计来处理 html的,因此它不善于处理二进制数据,只有数值和字符串类型.而 node 是基于 js 的,因为 node 需要实现一些譬如数据库通信.操作图像及 ...

  7. mysql log and lock

    mysql bin log==> /etc/my.cnf==> log_bin=/var/log/mysql/mysql-bin.log==> binlog_do_db=your_d ...

  8. linux 修改普通用户的 max user process

    因为出现  fork: retry: No child processes 问题 , google了一下 , 大家说是要去修改 /etc/security/limits.conf 文件 , 然后我用r ...

  9. 三年磨一剑,robot framework 自动化测试框架核心指南,真正讲透robot framework自动化测试框架(笔者新书上架)。

    序 关于自动化测试的工具和框架其实有很多.自动化测试在测试IT行业中扮演着越来越重要的角色,不管是在传统的IT行业还是高速发展的互联网行业或是如今的大数据和大热的人工智能领域,都离不开测试,也更加离不 ...

  10. Python自学:第三章 使用函数sort( )对列表进行临时排序

    # -*- coding: GBK -*- cars = ["bmw", "audi", "toyota", "subaru&qu ...