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> < ...
随机推荐
- MapReduce的执行过程.
作业在运行时,数据或者是作业调用的一个运行图. 用户写的代码通过JobClient提交给JobTracker Job对象中封装了JobClient JobConf和我们的Job对象几乎是一回事. 把我 ...
- Linux Oracle服务启动&停止脚本与开机自启动
在CentOS 6.3下安装完Oracle 10g R2,重开机之后,你会发现Oracle没有自行启动,这是正常的,因为在Linux下安装Oracle的确不会自行启动,必须要自行设定相关参数,首先先介 ...
- Yii CModel中rules验证规则
array( array(‘username’, ‘required’), array(‘username’, ‘length’, ‘min’=>3, ‘max’=>12), array( ...
- google proto buffer安装和简单示例
1.安装 下载google proto buff. 解压下载的包,并且阅读README.txt,根据里面的指引进行安装. $ ./configure $ make $ make check $ mak ...
- JavaWeb应用中重定向与跳转的区别
针对JSP与Servlet: 两种重要的跳转: 1.request.getRequestDispatcher("地址").forward(ServletRequest, Servl ...
- oracle 的rowid和rownum
rowid就是唯一标志记录物理位置的一个id,对于rownum来说它是oracle系统顺序分配为从查询返回的行的编号,返回的第一行分配的是1,第二行是2,依此类推,这个伪字段可以用于限制查询返回的总行 ...
- Chrome的Postman的使用
Chrome提供了一个很好的Web App 名为 Postman 使用这个web app,你可以输入一个url,然后可以很清楚的看到返回的各种结果 直接在Google中输入Postman, 找到它 ...
- HL7及PIX相关的测试工具
最近在开发PIX项目时需要一些工具, 比如PIX各个Actor的测试工具, HL7消息的验证工具等等. 下面列下我找见的几个 必备工具. 1. http://hit-testing.nist.gov: ...
- Ecshop 学习之路一 2016年6月30日
以前下载ecshop 都是在ecshop官网上下载,前后台模板都很难看.功能也不太齐全,这次在模板堂下载了ecshop 模板 仿小米的.做一个简单的电商网站. 页面结构还是挺简单的.功能也齐全.用ec ...
- NET程序的破解--静态分析(Xenocode Fox 2006 Evaluation)
NET程序已经红红火火的兴起,就象LINUX一样势不可挡的涌来.作为一名Cracker,你会选择躲避吗?嘿嘿,对俺而言,挑战更富有趣味. 破解好几个.NET的程序了,一直想写出来,只是时间问题,所以拖 ...