1.官方解释：

　　p:nth-child(2)     选择属于其父元素的第二个子元素的每个 <p> 元素。
　　p:nth-of-type(2) 选择属于其父元素第二个 <p> 元素的每个 <p> 元素。

2.大白话

　　p:nth-child(2)　　选择p同级元素中的（从前到后的）第二个元素

　　p:nth-of-type(2) 　选择p同级元素中的第二个p元素

第一个是不管谁都得算上，第二个只管看p元素

简单的实例了解一下

p:nth-child(2):

<style>  p:nth-child(2) { background:hotpink; } /*选中的是p的父元素的第二个元素*/ </style>

<body>

　　<h1>这是标题</h1>

　　<p>第一个段落。</p>

　　<p>第二个段落。</p>

　　<p>第三个段落。</p>

　　<p>第四个段落。</p>

</body>

p:nth-of-type(2):

<style>  p:nth-of-type(2){background: hotpink;} /* 选中的是p的父元素的子元素中第二个p*/ </style>

<body>

    <h1>这是标题</h1>

    <p>第一个段落。</p>

    <p>第二个段落。</p>

    <p>第三个段落。</p>

    <p>第四个段落。</p>

    <p>第五个段落。</p>

</body>

nth-child(n)和nth-of-type(n)的区别的更多相关文章

  1. button与input[type=”button”]的区别

    button与input[type="button"]的区别 特别感谢 @守护晴天 ,指出了博客中不细致不严谨的地方,也让我学到了更多,更多是觉得抱歉,由于自己的不细致可能误导了一 ...

  2. C#中的值类型（value type）与引用类型（reference type）的区别

    ylbtech- .NET-Basic:C#中的值类型与引用类型的区别 C#中的值类型(value type)与引用类型(reference type)的区别 1.A,相关概念返回顶部     C#中 ...

  3. 关于<button> 没写 type='button' 导致点击时提交以及<button>和<input type="button">的区别

    这是我的第一篇博客,如果写的不好,请见谅 这是一个关于button按钮一个小问题 最近刚开学跟着老师一起写代码,在模仿JAVA web程序设计(慕课版) P61页第三章 Ajax处理XML的代码中发现 ...

  4. <button>和<input type="button"> 的区别

    <button>标签 定义和用法 <button> 标签定义一个按钮. 在 button 元素内部,您可以放置内容,比如文本或图像.这是该元素与使用 input 元素创建的按钮 ...

  5. <button>与<input type="button"> 的区别

    <button> button按钮点击会刷新整个页面 <input type="button">  不会刷新整个页面 本文为本人用来记录自己做的一些东西,如 ...

  6. <button>与<input type="button">的区别

    一.定义和用法 <button> 标签定义的是一个按钮. 在 button 元素内部,可以放置文本或图像.这是<button>与使用 input 元素创建的按钮的不同之处. 二 ...

  7. type() 和 isinstance()区别

    a=111 # type() 返回数据类型 In: type(a)  Out: int In: print(type(a)) Out: <class 'int'> # isinstance ...

  8. find、which、whereis、locate和type之间的区别

    1.find find是最常用和最强大的查找命令.它能做到实时查找,精确查找,但速度慢. find的使用格式如下: #find [指定目录] [指定条件] [指定动作] 指定目录:是指所要搜索的目录和 ...

  9. jquery中选择器input:hidden和input[type=hidden]的区别

    关于选择器:hidden的说明,在jquery说明文档中是这样说的:匹配所有不可见元素,或者type为hidden的元素.而[type=hidden]是查找所有type属性等于hidden的元素.两者 ...

  10. 解析<button>和<input type="button"> 的区别

    一.定义和用法 <button> 标签定义的是一个按钮. 在 button 元素内部,可以放置文本或图像.这是<button>与使用 input 元素创建的按钮的不同之处. 二 ...

随机推荐

  1. linux sqlite3 相关

    数据库sqlite 1 用下载好的安装包安装 linux@ubuntu:~/sqlite3$ sudo dpkg -i libsqlite3-0_3.7.2-1ubuntu0.1_i386_1.deb ...

  2. [Swift]LeetCode1002. 查找常用字符 | Find Common Characters

    Given an array A of strings made only from lowercase letters, return a list of all characters that s ...

  3. python glob的安装和使用

    基本概念 glob是python自己带的一个文件操作相关模块,用它可以查找符合自己目的的文件,类似于Windows下的文件搜索,支持通配符操作.*,?,[]这三个通配符,*代表0个或多个字符,?代表一 ...

  4. 微信小程序day01-JSON配置

    微信小程序 小程序代码构成 JSON配置WXML模板WXSS样式JS逻辑 1.JSON配置 小程序配置 app.json app.json: 是当前小程序的全局配置,包括了小程序的所有页面路径.界面表 ...

  5. AutoFac - 将 autofac 应用于MVC多层项目

    一.前言 AutoFac是.NET平台下的一款著名的IoC Container,它可以让我们很轻松的解除项目中服务类的接口与客户类的接口实现类之间的依赖关系,从而降低系统各模块之间耦合程度以提高系统的 ...

  6. 【JMeter】（2）---HTTP压测

    JMeter---HTTP压测 一.创建线程组 右击-->添加-->Threads(Users)-->线程组 下面对比较重要的几个参数,讲解下: 名称: 就是给你这个线程组起名字. ...

  7. C# 获取 ipv4的方法

    NetworkInterface[] nics = NetworkInterface.GetAllNetworkInterfaces(); foreach (NetworkInterface adap ...

  8. 使用ML.NET实现NBA得分预测

    使用ML.NET实现NBA得分预测 导读:ML.NET系列文章 ML.NET已经发布了v0.2版本,新增了聚类训练器,执行性能进一步增强.本文将介绍一种特殊的回归--泊松回归,并以NBA比赛得分预测的 ...

  9. Spring Boot分布式系统实践【1】-架构设计

    前言 [第一次尝试去写一个系列,肯定会有想不到的地方,欢迎大家留言指正] 本系列将介绍如果从零构建一套分布式系统.同时也是对自己过去工作的一个梳理过程. 本文先整理出构建系统的主要技术选型,以及技术框 ...

  10. HBase查询优化

    1.概述 HBase是一个实时的非关系型数据库,用来存储海量数据.但是,在实际使用场景中,在使用HBase API查询HBase中的数据时,有时会发现数据查询会很慢.本篇博客将从客户端优化和服务端优化 ...