如何让Iconfont作用到content伪类中
沿用同行思密达的方法整理了一下;前提是先引入iconfont字体图标(引用线上iconfont查看上篇随笔):比如
其中&#
是开头用以标明这是字符实体,x
表示这是十六进制,而CSS的content接受的也是16进制的Unicode编码,所以可以直接写 content: "\e7bb";
别忘记把font-family:"iconfont"写进去,很重要的
<style typel="text/css">
.show:before{
font-family: "iconfont";
content: "\eae2";
color: red;
width: 20px;
height: 20px;
position: absolute;
left: 5%;
}
</style>
<div class="show"></div>
如何让Iconfont作用到content伪类中的更多相关文章
- iconfont作用在css伪类中的写法
iconfont作用在css伪类中需要注意两点: 1.字体声明(font-family: "iconfont";). 2.把字体写成十六进制的Unicode编码.比如:" ...
- CSS中2d转换:transition过渡放在:hover伪类中与应用在整个元素中区别
css的2d转换十分强大,能够在不使用js的情况下,实现页面的元素与用户之间更多动态的交互,增强用户体验.其中使用最多的就是hover伪类. 1.创建一个页面的div元素: <!DOCTYPE ...
- 一、关于a标签伪类中的visited不起作用问题
一.代码示范 <html> <head> <title>伪类超链接</title> <!--<link href="./test. ...
- CSS-用伪类制作小箭头(轮播图的左右切换btn)
先上学习地址:http://www.htmleaf.com/Demo/201610234136.html 作者对轮播图左右按钮的处理方法一改往常,不是简单地用btn.prev+btn.next的图片代 ...
- CSS3 选择器——伪类选择器
前面花了两节内容分别在<CSS3选择器——基本选择器>和<CSS3选择器——属性选择器>介绍了CSS3选择器中的基本选择器和属性选择器使用方法,今天要和大家一起学习CSS3选择 ...
- CSS3选择器(三)之伪类选择器
伪类选择器对于大家来说最熟悉的莫过于:link,:focus,:hover之类的了,因为这些在平时中是常用到的伪类选择器,那么先和大家一起简单总 结一下CSS中常用的伪类选择器的使用方法,最后把重心放 ...
- CSS中伪类的使用
原文:http://www.cnblogs.com/guopei/archive/2011/04/16/2017627.html 何为伪类? 也就是实际实现了类的效果,但是并没有实际添加到标签中的类, ...
- CSS中before、after伪类选择器的巧用
大家好,今天给大家带来使用css中 before . after 实现两个效果,话不多说,我们先来看看, before 和 after 它们的作用是什么 选择器 作用 before 向选定的元素前插入 ...
- 利用CSS hover伪类改变其他元素的总结
:hover 伪类经常用于页面的一些鼠标交互.链接点击变化,增强页面的用户体验,但是可以用来改变其他元素样式,可以在不使用JS 的情况下,达到想要的页面效果. 1.hover改变自身的效果: 鼠标悬浮 ...
随机推荐
- POJ1942——Paths on a Grid(组合数学)
Paths on a Grid DescriptionImagine you are attending your math lesson at school. Once again, you are ...
- python-append()方法
append() 方法向列表的尾部添加一个新的元素.只接受一个参数. >>> mylist = [1,2,3,4] >>> mylist [1, 2, 3, 4] ...
- knowledge about apache
http://wenku.baidu.com/link?url=6O51BQJdtFRFWDGszKfN3aK7IY92QTCpuc7miBhRLazXvxL5gXb18B_TqIdi3EruX1o_ ...
- socket关闭动作以及socket状态的总结
主要部分,四次握手: 断开连接其实从我的角度看不区分客户端和服务器端,任何一方都可以调用close(or closesocket)之类的函数开始主动终止一个连接.这里先暂时说正常情况.当调用close ...
- Flex Array内置排序方法的使用
在Array类中,提供内置的排序方法.排序是在软件开发的过程中,经常遇到的问题.通过这些内置的方法,可以快速轻便的进行排序操作. Array类提供sort方法对Array实例进行排序.sort方法没有 ...
- C# 框架是什么?MVC是什么 ?工厂模式是什么?设计模式是什么?三层架构是什
C# 框架是什么?MVC是什么 ?工厂模式是什么?设计模式是什么?三层架构是什么?如果要学我该从何学起??? C# 框架看这里http://download.csdn.net/source/25784 ...
- C#中的多文档的使用
1.首先,新建一个窗体,设置窗体的IsMdiContainer = true; 窗体的大小为700*600 长700 高600 2.在窗体的Load事件中添加如下代码 private void F ...
- eclipse+pydev (python) 配置出错
错误: eclipse+pydev 配置出错,就是在选择python interpreter那一步: See error log for details.com.sun.org.apache.xerc ...
- Android 之 内存管理-查看内存泄露(三)
概述 在android的开发中,要时刻主要内存的分配和垃圾回收,因为系统为每一个dalvik虚拟机分配的内存是有限的,在google的G1中,分配的最大堆大小只有16M,后来的机器一般都为24M,实在 ...
- 架构版本与 NuGet 的版本不兼容 解决方案
VS的NuGet管理在大大提高了开发效率,一直都在使用但今天在遇到了一个问题,引用一个所需要的NuGet包VS缺提示如下错误