<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
</ul>

  li:nth-child(2) {

color:red;

}

选择器:

li:nth-of-type(2){

color:red;

}

显示的效果

这个时候  li:nth-child(2) 与  li:nth-of-type(2) 选择的是同一个 显示的效果是一样的

但............

因为没有选择到任何东西,所有这个时候 li:nth-child(2)  失效了

   选择是的 第二个li 元素   这个时候就看出来 nth-child 与 nth-of-type  这两个选择器的区别了

选择器 nth-child和 nth-of-type的区别的更多相关文章

  1. ASP.NET控件<ASP:Button /> html控件<input type="button">区别联系

    ASP.NET控件<ASP:Button />-------html控件<input type="button">杨中科是这么说的:asp和input是一样 ...

  2. const type& 与 type& 的区别

    const type& 与 type& 是C/C++编程中容易混淆的两个知识点,现在以 cont int& 与 int& 为例讲解: 1.int& 讲解 int ...

  3. form表单重复提交,type=“button”和type=“submit”区别

    公司测试提了一个项目后台在IE浏览器下(360,firefox就没问题)出现数据重复的问题,调试了好久终于发现问题所在,也不知道是谁写的代码,醉醉的.... 错误地点: <input type= ...

  4. 关于CSS各种选择器,还有各种引入样式表的区别,import导入样式表,在介绍一些伪类选择器

    (一)CSS选择器: 1.标签选择器:通过HTML的标签名直接选择该标签 2.类选择器:通过.选择器的名称{} 来对添加了class属性的标签进行选中 3.ID选择器:通过#选择器的名称{} 来对添加 ...

  5. from中buttone 和 input type="button" 区别

    在做一个表单提交时碰到的问题, 1.js判断阻止表单提交,如果是form 里面的button的话,恭喜你,你要再换个写法了.<button type="submit" ... ...

  6. Html中,id、name、class、type的区别

    <input type="text" name="name" id="name" class="txt"> ...

  7. isinstance与type的区别

    1.isinstance()内置函数 python中的isinstance()函数是python的内置函数,用来判断一个函数是否是一个已知类型.类似type. 2.用法: isinstance(obj ...

  8. linux 命令中的find locate whereis which type 使用区别

    find 最强大,但参数也较多,需指定查找目录,如 find / -name “filename” locate 是一个快速查找命令,有预先索引好的数据库,由于数据库是定时更新,因此,结果上可能会有迟 ...

  9. python isinstance()与type()的区别

    例如在继承上的区别: isinstance() 会认为子类是一种父类类型,考虑继承关系. type() 不会认为子类是一种父类类型,不考虑继承关系. class A: pass class B(A): ...

  10. jquery中选择器的 html() text() val() attr() 方法的区别与使用方式

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. 04-树4 是否同一棵二叉搜索树(25 point(s)) 【Tree】

    04-树4 是否同一棵二叉搜索树(25 point(s)) 给定一个插入序列就可以唯一确定一棵二叉搜索树.然而,一棵给定的二叉搜索树却可以由多种不同的插入序列得到.例如分别按照序列{2, 1, 3}和 ...

  2. Android Weekly Notes Issue #242

    Android Weekly Issue #242 January 29th, 2017 Android Weekly Issue #242 本期内容包括: Android中常用的设计模式; 基于No ...

  3. bzoj3669【NOI2014】魔法森林

    题面一道最短路好题…… 开始和喻队长讨论了一下,喻队长一眼切:枚举ai的上界MAX,每次把ai小于等于MAX的边加到图里,以bi为边权跑最短路. 但是,这样做是O(ai*m)的,妥妥TLE,于是我们想 ...

  4. Opencv— — Bias and Gain

    // define head function #ifndef PS_ALGORITHM_H_INCLUDED #define PS_ALGORITHM_H_INCLUDED #include < ...

  5. flask logger

    Flask uses standard Python logging. All Flask-related messages are logged under the 'flask' logger n ...

  6. CF 888E Maximum Subsequence——折半搜索

    题目:http://codeforces.com/contest/888/problem/E 一看就是折半搜索?……然后排序双指针. 两个<m的数加起来如果>=m,一定不会更新答案.因为- ...

  7. 11.boolean类型

    /* 关于java中的Boolean类型: 1)赋给boolean类型的值只有两个:ture或者false 2)boolean类型的数据主要用在逻辑运算和条件控制语句中.*/ public class ...

  8. 开始我的技术bolg之旅

    虽然做了快十年的IT但是真心觉得自己的水平很烂,IT这个行业keep learning很重要,之前每接触新东西都是随便学一下,有问题解决了就完事了,或者是再有问题临时抱佛脚,从来都没把学过或者做个的事 ...

  9. spring使用过程中遇到的问题

    1.出现这样的错误:The type org.springframework.core.NestedRuntimeException cannot be resolved. It is indirec ...

  10. TypeScript完全解读(26课时)_10.TypeScript完全解读-枚举

    10.TypeScript完全解读-枚举 新建enum.ts并在jindex.ts中引用 一个简单的数字枚举 可以通过两种方式获取枚举的值 获取到编码,第一个默认为0,后面的一次递增 第二种形式 可以 ...