css3 伪对象选择器添加几何图形文字的方法
伪对象选择器包含三种,分别为:
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 伪对象选择器添加几何图形文字的方法的更多相关文章
- jQuery实现隔行变色、悬停变色 ( CSS3伪类选择器:nth-child() )
<title>实现隔行变色</title> <script src="Js/jquery-1.8.0.min.js" type="text/ ...
- CSS3 伪类选择器 nth-child() 的用法
伪类选择器 nth-child() 在IE6-8和FF3.0-浏览器不支持,CSS3中nth-of-type(n)(比如nth-of-type(1))这个特殊的类选择符可以样式更加个性的标题和段落等, ...
- 巧用CSS3伪类选择器自定义checkbox和radio的样式
由于原生的checkbox和radio的样式太简陋了,在设计页面的时候,设计师往往会设计自己的checkbox和radio样式.一半情况下,为了适应各个浏览器的兼容性,我们都会用其他的元素替代原生的c ...
- css伪元素选择器(伪对象选择器)checked + 伪元素练习
伪对象也叫伪元素,在过去,伪类和伪元素都被书写成前面只加一个冒号,实际上应该是: :weilei ::伪元素 而现在我们为了兼容旧的书写方式,用一个冒号引导伪类也是能被解析的. 伪类一般反应无法在CS ...
- CSS3 伪类选择器 :nth-child()
:nth-child()可以选择某个的一个或多个特定的子元素,你可以按这种方式进行选择: :nth-child(length);/*参数是具体数字*/ :nth-child(n);/*参数是n,n从0 ...
- CSS3伪类选择器:nth-child()(nth-child(odd)/nth-child(even))
nth-child(odd):奇数 nth-child(even):偶数 使用时,如果是精确到数字时,切记是从同一级别的元素开始计算,而不是指定某个类才开始计算. 比如: <li>< ...
- CSS3伪类选择器
first-line 设置首行样式 first-letter 设置首字母样式 before 在某元素前插入内容并设置内容样式 after 在某元素后插入内容并设置内容样式 <!DOCTYP ...
- CSS3伪类选择器 图示
- CSS3的新增选择器
一.兄弟选择器:选择E元素所有兄弟元素F. <style> p~p{ color:#f00;} </style> </head> <body> < ...
随机推荐
- 在Ubuntu6.06 在搭建SVN服务器及在windows建立svn+ssh客户端
部门现在使用的Linux系统是Ubuntu6.06,内核版本为2.6.15-57-386.由于系统比较老,所有用网上介绍的方法搭建SVN服务器经常出错,所以参考文章[1],将自己的搭建过程记录下. 1 ...
- [HIve - LanguageManual] Union
Union Syntax select_statement UNION ALL select_statement UNION ALL select_statement ... UNION is use ...
- librtmp推流使用aac编码音频的html5和flash播放问题
公司项目中使用rtmp推流,音频编码aac.视频编码H264.windows和android平台都没有发现问题.然而在IOS版本的APP中发现几个问题:1. 推流后flash播放异常2. IOS平台微 ...
- [iOS UI进阶 - 3.2] 手势识别器UIGestureRecognizer
A.系统提供的手势识别器 1.敲击手势 UITapGestureRecognizer numberOfTapsRequired: 敲击次数 numberOfTouchesRequired: 同时敲 ...
- C++库研究笔记——操作符重载实现类型转换&这样做的意义
目标: 已知这个接口: std::vector<double> add_vec(double *d1, double *d2) { ..... return result; } 我们自定义 ...
- [转]MyEclipse for Spring2014破解
转至:http://blog.my-eclipse.cn/myeclipse-2014-crack.html 一.安装完成MyEclipse2014(适用于2013等版本)后,不要打开软件,下载破解附 ...
- hdu 4781 Assignment For Princess (2013ACMICPC 成都站 A)
http://acm.hdu.edu.cn/showproblem.php?pid=4781 由于题目太长,这里就不直接贴了,直接说大意吧. 题目大意:有一个n个点,m条边的有向图,每条边的权值分别为 ...
- 《解剖PetShop》系列转载
1 <解剖PetShop>系列之六 PetShop之表示层设计 http://ityup.com/showtopic-8.html 2 <解剖PetShop>系列之五 ...
- 在Mac OS X下让你的Terminal带上Color
之所以我们这么喜欢OS X,是它自带了command line工具,但是Apple厂商为Terminal设置很多的默认值,导致界面很丑没有什么颜色我们很伤心,同时我们希望界面是五颜六色的,至少是彩色的 ...
- [置顶] 《Windows编程零基础》__2 一个完整的程序
Windows开发的常识 1)窗口 Windows中最基本的概念也许就是窗口了,每一个前台程序都至少有一个窗口,一个窗口也是你可以看到的部分,比如,QQ有如下的登录窗口 基本上你在Windows中可见 ...