在 :after/ :before 使用 font awesome web Icon
.element {
position: relative;
}
/*replace the content value with the
corresponding value from the list below*/
.element:before {
content: "\f000";
font-family: FontAwesome;
font-style: normal;
font-weight: normal;
text-decoration: inherit;
/*--adjust as necessary--*/
color: #000;
font-size: 18px;
padding-right: 0.5em;
position: absolute;
top: 10px;
left:;
}
来源: http://astronautweb.co/snippet/font-awesome/
在 :after/ :before 使用 font awesome web Icon的更多相关文章
- @font-face制作Web Icon
@font-face是CSS3中有关于字体设置的属性,通过@font-face可以将本地字体设置为Web页面字体,并能兼容所有浏览器,使用这个属性就不必担心用户本地不具备这样的字体.因为我们把字体都上 ...
- Web 设计新趋势: 使用 SVG 代替 Web Icon Font
如果你还在使用 Icon Font 作为网页中显示图标的实现方案,那么你可能有点 Out 了. 由于使用 Icon Font 显示图标存在一些缺陷,开发者们一直在致力于探索使用 SVG 作为替代的方法 ...
- WEB ICON 的探讨
一般考虑到webicon 就是cssSprite和自定义font:本文基于下述而总结和进行分析,如有笔误有望指出,谢谢 在线教程:用字体在网页中画ICON图标 http://www.imooc.com ...
- 为网站文字前面添加图标 在线调用 Font Awesome 字体icon小图标 美化网站
一.如何开始 1.将下面的代码复制粘贴到HTML页面面的 <head> 下面 <link rel="stylesheet" href="https:// ...
- [记录] web icon 字体
weloveiconfonts 在http://codepen.io/cguillou/pen/jmkfK 中看css发现既然有这样的,yes!
- 如何在移动端app中应用字体图标icon fonts (转)
原文: http://www.cnblogs.com/willian/p/4166757.html?utm_source=tuicool&utm_medium=referral How to ...
- 如何在移动端app中应用字体图标icon fonts
How to use icon fonts in your mobile apps 在任何APP设计中实现可图形的矢量缩放最完美的方式是使用字体图标. 移动端的设计变的越来越复杂.原因在于多样的屏幕尺 ...
- Font Awesome使用方法
Font Awesome(中文站点)是一套为Bootstrap而创造的图标字体库及CSS框架,在业界享有盛誉. FA包含了常规web开发所需要用到的几乎所有图标,并且免费授权使用,只需要下载即可.所有 ...
- 从web现状谈及前端性能优化
从web现状谈及性能优化 原文出处:<Karolina Szczur: The State of the Web> 性能优化指南The Internet is growing expone ...
随机推荐
- linux系统解决boot空间不足
有时候更新Linux系统是会碰到boot空间不足的错误,原因基本上是安装时boot空间设置问题可以通过删除旧的内核来释放boot空间. ubuntu: 1.查看当前使用内核版本号 unam ...
- java_I/O字符流
I/O流(Stream) INPUT:输入流,从文件里读OUPUT:输出流,写内容到文件 IO流分为:字符流和字节流 字符流:处理纯文本文件. 字节流:处理可以所有文件. 字符输出流测试: @Test ...
- Linux之E: 无法锁定管理目录(/var/lib/dpkg/),是否有其他进程正占用它?
解决 ubantu系统中 E: 无法锁定管理目录(/var/lib/dpkg/),是否有其他进程正占用它? 的 问题. 1.解决办法: 当我们有的时候在使用apt-get install/update ...
- 基于CH340的一键下载电路
一.CH340简介 CH340 是一个 USB 总线的转接芯片,实现 USB 转串口或者 USB 转打印口.CH340是国产芯片,应用场合居多,市场占有率很高.常用的USB转串口芯片还有CP2102. ...
- Java多线程—阻塞队列和生产者-消费者模式
阻塞队列支持生产者-消费者这种设计模式.该模式将“找出需要完成的工作”与“执行工作”这两个过程分离开来,并把工作项放入一个“待完成“列表中以便在随后处理,而不是找出后立即处理.生产者-消费者模式能简化 ...
- (C/C++) STL 標頭檔 algorithm (一)
因為解題需求認識了一些STL相關funciton. 分別是 max_element (ForwardIterator first, ForwardIterator last); min_element ...
- Oracle数据库学习(一):虚拟机下Oracle Linux的安装与配置
这篇博文主要以图片的形式讲述Oracle Linux在虚拟机下的安装与配置 一.前期虚拟机安装ISO文件的配置 1.创建新的虚拟机 2.选择“自定义(高级)”选项,下一步,默认“虚拟机硬件兼容性”或选 ...
- 为apache提供sftp文件传输服务
一.安装apache yum install httpd 二.为 /var/www/html 创建ftp账号www useradd -M -d /var/www/html www 三.更改ssh配置文 ...
- tp5 数据库相关操作笔记
这里如何连接多个数据库? 1,在conif.php文件中添加一个数据库配置(把database.php文件内容复制一份过来),这里取名为db2 2,在控制器的方法中使用 mysql中的参数绑定 mys ...
- js中字符串的替换
定义和用法 replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串. 语法 stringObject.replace(regexp/substr,replac ...