<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. AndroidPageObjectTest_Chained.java

    以下代码使用ApiDemos-debug.apk进行测试 //这个脚本用于演示PageFactory的功能:链式注解@AndroidFindBys.@IOSFindBys.具体用法参考页面类的代码. ...

  2. UIView封装动画--iOS利用系统提供方法来做关键帧动画

    iOS利用系统提供方法来做关键帧动画 ios7以后才有用. /*关键帧动画 options:UIViewKeyframeAnimationOptions类型 */ [UIView animateKey ...

  3. WPF-悬浮在底部的导航

    先用Rectangle代替导航按钮,这个导航会悬浮在界面的底部,当鼠标移进导航按钮上的时候,按钮会放大,移出后恢复正常.   1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 1 ...

  4. 精选Java面试题(二)

    Java中的方法覆盖重写(Overriding)和方法重载(Overloading)是什么意思? Java中的方法重载发生在同一个类里面两个或者是多个方法的方法名相同但是参数不同的情况.与此相对,方法 ...

  5. CodeForces960F:Pathwalks (主席树+DP)

    You are given a directed graph with n nodes and m edges, with all edges having a certain weight. The ...

  6. Win32编程点滴3 - 简单ActiveX控件的使用

    虽然这里一片的.net气氛,到处充斥着像MVC.WPF.WorkFlow.LINQ等各种niubility的术语.但我们使用的Windows还是由COM技术主宰着:我们在选择日常使用的软件时,也会避免 ...

  7. 读取spring boot项目中resource目录下的文件

    在开发中, 我们常常要将我们的配置文件或者模板文件放在我们的resource目录中. 如下 而在spring boot的项目中, 我们运行的是一个jar包, 并没有解压 所以当我们使用以下方式获取文件 ...

  8. hue集成各种组件

    一.Hue安装 可以编译安装,我这里有已经编译好的,直接解压使用: hue默认端口:8888 http://gethue.com/ https://github.com/cloudera/hue ht ...

  9. LeetCode: 258 Add Digits(easy)

    题目: Given a non-negative integer num, repeatedly add all its digits until the result has only one di ...

  10. spown mj

    local function getmjvalnew(key) local keynew = {} local sumnval = 0 for _, v in ipairs(key) do if v& ...