伪对象选择器包含三种,分别为:

E::selection

E::after

E::before

其中before和after必须与content结合使用,如果content想用几何图形要加 \ 进行转义,content里面的内容相当于文字,可以通过color改变颜色,font-size改变大小

等等。

其书写方式为:

#E::before{
content:"\25C0";//获取的方法
color: rgba(254, 0, 0, 0.6);//可以改变它的颜色
font-size: 20px;//可以改变它的大小
position: relative;
left: -29px;//改变位置
}

css3 伪对象选择器添加几何图形文字的方法的更多相关文章

  1. jQuery实现隔行变色、悬停变色 ( CSS3伪类选择器:nth-child() )

    <title>实现隔行变色</title> <script src="Js/jquery-1.8.0.min.js" type="text/ ...

  2. CSS3 伪类选择器 nth-child() 的用法

    伪类选择器 nth-child() 在IE6-8和FF3.0-浏览器不支持,CSS3中nth-of-type(n)(比如nth-of-type(1))这个特殊的类选择符可以样式更加个性的标题和段落等, ...

  3. 巧用CSS3伪类选择器自定义checkbox和radio的样式

    由于原生的checkbox和radio的样式太简陋了,在设计页面的时候,设计师往往会设计自己的checkbox和radio样式.一半情况下,为了适应各个浏览器的兼容性,我们都会用其他的元素替代原生的c ...

  4. css伪元素选择器(伪对象选择器)checked + 伪元素练习

    伪对象也叫伪元素,在过去,伪类和伪元素都被书写成前面只加一个冒号,实际上应该是: :weilei ::伪元素 而现在我们为了兼容旧的书写方式,用一个冒号引导伪类也是能被解析的. 伪类一般反应无法在CS ...

  5. CSS3 伪类选择器 :nth-child()

    :nth-child()可以选择某个的一个或多个特定的子元素,你可以按这种方式进行选择: :nth-child(length);/*参数是具体数字*/ :nth-child(n);/*参数是n,n从0 ...

  6. CSS3伪类选择器:nth-child()(nth-child(odd)/nth-child(even))

    nth-child(odd):奇数 nth-child(even):偶数 使用时,如果是精确到数字时,切记是从同一级别的元素开始计算,而不是指定某个类才开始计算. 比如: <li>< ...

  7. CSS3伪类选择器

    first-line   设置首行样式 first-letter 设置首字母样式 before  在某元素前插入内容并设置内容样式 after 在某元素后插入内容并设置内容样式 <!DOCTYP ...

  8. CSS3伪类选择器 图示

         

  9. CSS3的新增选择器

    一.兄弟选择器:选择E元素所有兄弟元素F. <style> p~p{ color:#f00;} </style> </head> <body> < ...

随机推荐

  1. oc_转_类的数组的实现和操作

    OC的数组对象的基本方法的使用:因为OC的数组中存储的为对象类型,所以我们可以新建一个Person类,通过Person生成对象进行操作. 其中Person.h中的代码为:   01.#import&l ...

  2. Oauth2 接口api

    weibo:http://open.weibo.com/wiki/API weixin:http://mp.weixin.qq.com/wiki/home/index.html   qq开发平台: 1 ...

  3. 在fedora20下面手动为自己的安装程序创建桌面图标

    (博客园-番茄酱原创) 在/usr/share/applications/下面创建destktop文件,用于产生桌面图标 创建文件:touch android-eclipse.desktop 编辑文件 ...

  4. 一个考察for循环题 讨论一下

    一道Java程序题,主要是考察for循环如下所示: public class Test { static boolean fun(char c) { System.out.print(c); retu ...

  5. Codeforces Round #364 (Div.2) D:As Fast As Possible(模拟+推公式)

    题目链接:http://codeforces.com/contest/701/problem/D 题意: 给出n个学生和能载k个学生的车,速度分别为v1,v2,需要走一段旅程长为l,每个学生只能搭一次 ...

  6. HDU 3072 Intelligence System (强连通分量)

    Intelligence System Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Othe ...

  7. HDU4570----Multi-bit Trie----简单的DP

    题目地址:http://acm.hdu.edu.cn/showproblem.php?pid=4570 题目意思: 给你N个数 要你分成多段,每段长度不能超过20 是的sum(ai*(2^bi))最小 ...

  8. CodeForces 707C Pythagorean Triples (数论)

    题意:给定一个数n,问你其他两边,能够组成直角三角形. 析:这是一个数论题. 如果 n 是奇数,那么那两边就是 (n*n-1)/2 和 (n*n+1)/2. 如果 n 是偶数,那么那两边就是 (n/2 ...

  9. java 关键字

    Keywords transient 序列化保存时,排除不想保存的字段时候用这个关键字修饰. final             final修饰的类不能被继承,final修饰的方法不能被重写,fina ...

  10. [转]MyEclipse for Spring2014破解

    转至:http://blog.my-eclipse.cn/myeclipse-2014-crack.html 一.安装完成MyEclipse2014(适用于2013等版本)后,不要打开软件,下载破解附 ...