CSS3伪类选择器
first-line 设置首行样式
first-letter 设置首字母样式
before 在某元素前插入内容并设置内容样式
after 在某元素后插入内容并设置内容样式
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
p:first-line{background: #CCFFCC;}
p:first-letter{color:red;}
p:before{ content: "前";}
p:after{content: "后";font-size: 50px;}
</style>
</head>
<body>
实例:
<p>第一行 <br />第二行</p> </body>
</html>
CSS3伪类选择器的更多相关文章
- CSS3 伪类选择器 nth-child() 的用法
伪类选择器 nth-child() 在IE6-8和FF3.0-浏览器不支持,CSS3中nth-of-type(n)(比如nth-of-type(1))这个特殊的类选择符可以样式更加个性的标题和段落等, ...
- jQuery实现隔行变色、悬停变色 ( CSS3伪类选择器:nth-child() )
<title>实现隔行变色</title> <script src="Js/jquery-1.8.0.min.js" type="text/ ...
- 巧用CSS3伪类选择器自定义checkbox和radio的样式
由于原生的checkbox和radio的样式太简陋了,在设计页面的时候,设计师往往会设计自己的checkbox和radio样式.一半情况下,为了适应各个浏览器的兼容性,我们都会用其他的元素替代原生的c ...
- CSS3伪类选择器:nth-child()(nth-child(odd)/nth-child(even))
nth-child(odd):奇数 nth-child(even):偶数 使用时,如果是精确到数字时,切记是从同一级别的元素开始计算,而不是指定某个类才开始计算. 比如: <li>< ...
- CSS3 伪类选择器 :nth-child()
:nth-child()可以选择某个的一个或多个特定的子元素,你可以按这种方式进行选择: :nth-child(length);/*参数是具体数字*/ :nth-child(n);/*参数是n,n从0 ...
- CSS3伪类选择器 图示
- CSS动态伪类选择器温故-3
动态伪类选择器 伪类选择器:大家熟悉的:[:link][:visited][:hover][:active]CSS3的伪类选择器分为六种:(1)动态伪类选择器(2)目标伪类选择器(3)语言伪类选择器( ...
- CSS动态伪类选择器温故
动态伪类选择器 伪类选择器:大家熟悉的:[:link][:visited][:hover][:active]CSS3的伪类选择器分为六种:(1)动态伪类选择器(2)目标伪类选择器(3)语言伪类选择器( ...
- CSS3 nth 伪类选择器
考察下面的 HTML 代码片段: <div> <section>section 1</section> <section>section 2</s ...
随机推荐
- 基础语法 swift
强类型语言:每句代码可以不用分号分隔:大小写敏感: 变量声明: var a = 0 常量声明 let b = 3.14 常量不能+变量?a+b 类型标注 var s :String 打印 pringl ...
- 在Eclipse中怎样写Java注释
java中的注释分为实现注释和文档注释 实现注释就是那些/……../和//……的注释,是注释程序用的,文档注释是/*……./的注释,是用来生成javadoc的.设置方法如下: 1.打开Eclipse的 ...
- ELK:kibana使用的lucene查询语法
kibana在ELK阵营中用来查询展示数据elasticsearch构建在Lucene之上,过滤器语法和Lucene相同 kibana4官方演示页面 全文搜索 在搜索栏输入login,会返回所有字段值 ...
- 【概率DP/高斯消元】BZOJ 2337:[HNOI2011]XOR和路径
2337: [HNOI2011]XOR和路径 Time Limit: 10 Sec Memory Limit: 128 MBSubmit: 682 Solved: 384[Submit][Stat ...
- Leetcode#140 Word Break II
原题地址 动态规划题 令s[i..j]表示下标从i到j的子串,它的所有分割情况用words[i]表示 假设s[0..i]的所有分割情况words[i]已知.则s[0..i+1]的分割情况words[i ...
- 3-Highcharts 3D图之3D柱状图分组叠堆3D图
<!DOCTYPE> <html lang='en'> <head> <title>3-Highcharts 3D图之3D柱状图分组叠堆3D图</ ...
- [百度空间] [note] pointer to member is a POD type
C++03 3.9-10: 1 Arithmetic types (3.9.1), enumeration types, pointer types, and pointer to member ty ...
- SQL SERVER 导出到Oracle 问题与技巧
工具: 使用SQL SERVER自带的导入, 导出工具 技巧: 一. 使用Oracle Provider for OLE DB(强制推荐) 1. 速度快 2. 要安装Oracle驱动(Oracle ...
- C#单链表(数据结构)
学习单链表的源码项目:http://files.cnblogs.com/xmfdsh/CSharp%E5%8D%95%E9%93%BE%E8%A1%A8.rar 链表是用一组任意的存储单元来存储线性表 ...
- PE文件结构详解
(注:最左边是文件头的偏移量.) IMAGE_DOS_HEADER STRUCT { +0h WORD e_magic // Magic DOS signature MZ(4Dh 5Ah) DOS可执 ...