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是两种预定义的媒体类 ...
随机推荐
- Protocol Buffer 时间类型定义
ProtoBuf3中新增了TimeStamp类型,使用示例如下: syntax = "proto3"; import public "google/protobuf/ti ...
- 非常有用的GitHub链接
平常开发工作中,我经常取Github上搜索项目,Clone下来学习使用,在这个过程中,发现了好多比较好的Github地址,记录下来,分享出去. image 非常有用的GitHub链接(顺序不分先后): ...
- 【java】实现Interface java.lang.Comparable<T>接口的int compareTo(T o)方法实现对象数组或链表或集合的排序,和挽救式对象比较器Interface java.util.Comparator<T>
package 对象比较排序; import java.util.Arrays; class A implements Comparable<A>{ private String name ...
- 环链表相关的题目和算法[LeetCode]
这篇文章讨论一下与链表的环相关的题目,我目前遇到的一共有3种题目. 1.判断一个链表是否有环(LeetCode相关题目:https://leetcode.com/problems/linked-lis ...
- UITableView的性能优化
UITableView作为ios中使用最频繁的控件之一,其性能优化也是常常要面对的,尤其是当数据量偏大并且设备性能不足时.本文旨在总结tableview的几个性能优化tips,并且随着认识的深入,本文 ...
- Keras的安装与配置
Keras是由Python编写的基于Tensorflow或Theano的一个高层神经网络API.具有高度模块化,极简,可扩充等特性.能够实现简易和快速的原型设计,支持CNN和RNN或者两者的结合,可以 ...
- c语言库函数测试
1.函数名: abort功 能: 异常终止一个进程用 法: void abort(void);程序例: #include <stdio.h> #include <stdlib.h ...
- C 标准I/O库粗略实现
本文同时发表在 https://github.com/zhangyachen/zhangyachen.github.io/issues/123 写一下fopen/getc/putc等C库的粗略实现,参 ...
- Swift学习第二天--面向对象
//: Playground - noun: a place where people can play import UIKit var str = "Hello, playground& ...
- HtmlTestRunner无法生成HTML报告问题
环境: Python3.6 + Selenium3.3.0 + HtmlTestRunner1.1.0 ON Windows10 IDE: PyCharm HtmlTestRunner地址: http ...