CSS3中nth-of-type和nth-last-of-type
1.使用nth-child和nth-last-child时会产生的问题
在使用nth-child和nth-last-child时,其计算子元素是奇数个元素还是第偶数个元素时,是连同父元素中的所有子元素一起计算的。
当父元素是列表时,列表中只可能有列表项目一种子元素,所以不会出问题,但是当父元素是div时,div包含多种子元素,会出现问题。
2.使用nth-of-type和nth-last-of-type
<style type="text/css">
h2:nth-of-type(odd){
background:yellow;
}
h2:nth-of-type(even){
background:blue;
}
</style>
//只计算h2元素的,而不会包含和h2同级别的其他元素
CSS3中nth-of-type和nth-last-of-type的更多相关文章
- CSS3中的动画效果记录
今天要记录的是CSS3中的三种属性transform.transition以及animation,这三个属性大大提升了css处理动画的能力. 一.Transform 变形 CSS中transform ...
- CSS和CSS3中的伪元素和伪类(总结)
好多人伪类和伪元素分清楚,其实就是一句话,“伪类的效果可以通过添加一个实际的类来达到,而伪元素的效果则需要通过添加一个实际的元素才能达到”. CSS中伪类包括: :first-child :lang ...
- img及父元素(容器)实现类似css3中的background-size:contain / background-size:cover
img及父元素(容器)实现类似css3中的background-size:contain / background-size:cover <!DOCTYPE html> <html ...
- css3中transition和animation的回调处理
弱鸡最近在准备面试,网上找了一些题,发现一些基础题也完全答不好(┬_┬)看来还是要再接再励啊w(゚Д゚)w 言归正传,今天的主题是CSS3中的动画回调处理,这里动画执行完毕后触发的事件是transit ...
- css3中变形与动画(三)
transform可以实现矩阵变换,transition实现属性的平滑过渡,animation意思是动画,动漫,这个属性才和真正意义的一帧一帧的动画相关.本文就介绍animation属性. anima ...
- html5 css3中的一些笔记
<!DOCTYPE html> <html> <head> <meta charset="utf-8" > <title> ...
- css3 中的transition和transform
我以前始终都把他搞反,或者是混淆.现在可以稍微小结下. Transition:CSS3中处理动画的一个样式:只涉及动画起始和终止两个状态.如果涉及到一个动画的各个时间或者状态,那就必须要用到的另外一个 ...
- CSS3中媒体查询,更换样式表
<link rel="stylesheet" href="css/1.css" media="(min- width:600px)"& ...
- 初识 css3中counter属性
最近看到counter属性,好奇是做什么用的,于是去查了查. 1.简单介绍 counter是为css中插入计数器.[注明]在CSS2.1中counter()只能被使用在content属性上.关于浏览器 ...
- 媒体查询的应用以及在css3中的变革
CSS一直都支持设置与媒体相关联的样式表.它们可以适应不同媒体类型的显示.例如,文档在屏幕显示时使用sans-serif字体,在打印时则使用serif字体.screen和print是两种预定义的媒体类 ...
随机推荐
- 《编程人生:15位软件先驱访谈录》【PDF】下载
<编程人生:15位软件先驱访谈录>[PDF]下载链接: https://u253469.pipipan.com/fs/253469-230382231 内容简介 本书适合所有程序员,也适合 ...
- 5.python函数
一.递归函数 如果一个函数在内部调用自身,那么这个函数就叫做递归函数. 1. 必须有一个明确的结束条件: 2. 每次进入更深一层递归时,问题规模相比上次递归都应有所减少: 3.递归效率不高,递归层次过 ...
- JAVA Socket编程(二)之TCP通信
基于TCP(面向连接)的socket编程,分为客户端和服务器端. 客户端的流程如下: (1)创建套接字(socket) (2)向服务器发出连接请求(connect) (3)和服务器端进行通信(send ...
- 浅析c++和c语言的enum类型
1.先看c语言枚举类型 1.c语言定义枚举类型,每一个枚举元素都是一个整数2.注重数据类型,没有数据类型限定3.相邻枚举元素相差整数4.可以通过整数访问,不够安全 2.上代码: 1 #include& ...
- openstack操作之一 命令行
在openstack环境中提供了多种操作虚拟机的方法,有最简单直接的dashborad界面,有不直观但高效的命令行,还有进阶版的postman调用openstack restfulapi和命令行中使用 ...
- Windows as a Service(4)——使用Intune管理Windows10更新
这是这个系列的最后一篇文章,我已经花了三篇的篇幅和大家分享有关于Windows as a Serivce的相关内容,链接如下: Windows as a Service(1)-- Windows 10 ...
- 对于group by 和 order by 并用 的分析
今天朋友问我一个sql查询. 需求是 找到idapi最近那条数据,说明idapi 是重复的,于是就简单的写了 SELECT * FROM `ag_alarm_history` group by ` ...
- JFinal极速开发框架使用笔记
记录第一次使用JFinal,从简单的框架搭建到增删改查,从自带的方法到正常框架习惯的使用方式. JFinal官网:http://www.jfinal.com/ JFinal 是基于 Java 语言的极 ...
- input同步标签内容——函数
html部分: <h3 class="font18" id="tit1">微蜂传媒电子商务有限公司</h3> <span clas ...
- base64格式图片转换为FormData对象进行上传
原理:理由ArrayBuffer.Blob和FormData var base64String = /*base64图片串*/; //这里对base64串进行操作,去掉url头,并转换为byte va ...