[css] 举例说明伪类:nth-child、:first-child与:first-of-type这三者有什么不同?

[css] 举例说明伪类:nth-child、:first-child与:first-of-type这三者有什么不同?

<div>
<p>大儿子</p>
<div>二儿子</div>
<p>三儿子</p>
</div>
<p>二叔</p>
<div>三叔<div>div:nth-child(2) 选中父元素里的第二个子元素div;(即二儿子被选中)
p:first-child 选中父元素里的第一个p元素;(大儿子被选中,二叔没有被选中,因为它不是父元素里的第一个元素)
p:first-of-type 选中第一个类型为p的子元素(大儿子、二叔被选中,因为大儿子是父元素div的第一个p元素,二叔是body的一个p元素)
:nth-child(n)和:first-child 是强调父元素里的第n个xx子元素,首先是第n个,然后才是xx类型;:first-of-type 主要强调类型,即一个父元素里,无论我们想选中的那个元素前面有多少个同级元素,都不算,只要找到父元素里的第一个xx子元素就行。

个人简介

我是歌谣,欢迎和大家一起交流前后端知识。放弃很容易,
但坚持一定很酷。欢迎大家一起讨论

主目录

与歌谣一起通关前端面试题

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/412803.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

多服务器 elk 搭建 [elasticsearch 7.0 ]

大家好&#xff0c;我是烤鸭&#xff1a; 今天分享一下多服务器的elk搭建。 1. 流程规划 2. 执行搭建 最新的版本和对应下载地址可以在官网查询到 https://www.elastic.co/cn/products/ 2.1 elasticsearch 7.0 搭建 2.1.1 下载 wget https://artifacts.elastic.co/…

[css] 请举例说明伪元素 (pseudo-elements) 有哪些用途?

[css] 请举例说明伪元素 (pseudo-elements) 有哪些用途&#xff1f; 可以不用再多写一个 dom可以用 content 搭配出很多效果例子&#xff1a;固定尺寸 2:1 的容器文本前后增加 icon 或图片使用 data-* 和 content: attr(data-*) 搭配使用 :hover 和 content 搭配出很多效果作为…

知乎问答:现在程序员的工资是不是被高估了?

对于优秀的程序员来说&#xff0c;薪酬的天花板犹如发际线&#xff0c;没有最高只有更高。而对于只想「混日子」的程序员来说&#xff0c;高薪很可能是泡沫&#xff0c;风一吹就碎。 一、程序员的工资真的高吗&#xff1f; 《2018年中国程序员生存状况报告》&#xff0c;来源&a…

springboot 闪退。falling back to default profiles: default StandardService - Stopping service [Tomcat]

大家好&#xff0c;我是烤鸭&#xff1a; 今天分享一个springboot 闪退的问题。确切得说是没有起来。 环境&#xff1a; springboot 版本 2.1.0.RELEASE 异常&#xff1a; 2019-05-25 19:39:00.822 > [main] > INFO com.cgmanage.migrate.MigrateApplication - Starti…

[css] 设置字体时为什么建议设置替换字体?

[css] 设置字体时为什么建议设置替换字体&#xff1f; 这是由于网站用户的浏览设备不同&#xff0c;可能并不支持或没有安装你所设置的字体。 这时候就会自动使用替换字体来对网页进行一个展示。 设置替换字体可以尽可能保证所有用户的浏览体验。个人简介 我是歌谣&#xff0…

lombok 的bug?lombok 导致 springmvc 使用 @RequestBody注解 接收 json数据 对象参数绑定失败

大家好&#xff0c;我是烤鸭&#xff1a; lombok 导致 springmvc 使用 RequestBody注解 接收 json数据 对象参数绑定失败。 环境版本&#xff1a; spring 5.x 1. 场景复现 问题出现在创建对象的属性名称。比如我有一个类中的属性值是 String aTest; 首字…

[css] 说说你对min-width和max-width的理解,它们有什么运用场景?

[css] 说说你对min-width和max-width的理解&#xff0c;它们有什么运用场景&#xff1f; min-width和max-width可以使得自适应布局保持一个基本的样式。 用于多列布局时候&#xff0c;可以保证某几列的布局保持在一定的范围内。 比较常见的应用应该是网站首页的三栏布局类型&a…

web APIS

WEB API系列&#xff1a; 很多人都很迷惑&#xff0c;既然有了WCF为什么还要有WEB API&#xff1f;WEB API会不会取代WCF&#xff1f; 就我的看法&#xff0c;WCF提供的是一种RPC实现的集合&#xff0c;WCF的设计更多地考虑了SOA的场景&#xff0c;以及各种RPC的问题。很多人也…

[css] 说说你对hasLayout的理解,触发hasLayout的方式有哪些?

[css] 说说你对hasLayout的理解&#xff0c;触发hasLayout的方式有哪些&#xff1f; hasLayout可理解为是IE7以及更旧版本的BFC。 跟BFC一样&#xff0c;hasLayout不能直接通过属性进行设置&#xff0c;而是需要一定的触发条件。具体条件可在进行向下兼容时再查阅相关资料&…

【mysql分区分表】mysql 按时间分区 【partition】

大家好&#xff0c;我是烤鸭&#xff1a; 今天分享一下有关 mysql 分区。 需求&#xff1a; 按时间分区。 对千万数据左右的表&#xff0c;进行分区&#xff0c;数据的增加量大概千万/年。 代码实现&#xff1a; 模拟之前已经存在的表&#xff1a; DROP TABLE IF EXISTS…

NOIp2018滚粗记

小蒟蒻chd在NOIp2018成功滚粗&#xff0c;下面向大家分享一下我的滚粗经验。 &#xff08;CCF竟然把老爷机给换了&#xff09; Day0 没什么好写的&#xff0c;反正就和平时一样。 Day1 早上6:50才起床&#xff0c;赶在7:20之前上了车&#xff0c;长沙理工大真的远&#xff0c;坐…

[css] 什么是zoom?它有什么作用?

[css] 什么是zoom&#xff1f;它有什么作用&#xff1f; zoom 最初是 IE 的私有属性&#xff0c;现在除了 Firefox 之外的浏览器基本都支持 zoom。不过&#xff0c;zoom 依旧不是正式的属性。与之对应的 transform 的 scale 属性是正式的 CSS 属性。zoom 主要的作用是用于元素…

【dubbo】http.conn.HttpHostConnectException.host: 'org.apache.http.HttpHost' could not be instantiated

大家好&#xff0c;我是烤鸭&#xff1a; dubbo遇到如下问题。 1. 异常详细信息&#xff1a; 某个异常对象无法实例化。 com.alibaba.dubbo.rpc.RpcException: Failed to invoke remote method: updateCardBycustomerNum, provider: dubbo://20.x.xx.48:20883/com.etc.servi…

2018 ACM-ICPC青岛现场赛 B题 Kawa Exam 题解 ZOJ 4059

题意&#xff1a;BaoBao正在进行在线考试&#xff08;都是选择题&#xff09;&#xff0c;每个题都有唯一的一个正确答案&#xff0c;但是考试系统有m个bug(就是有m个限制)&#xff0c;每个bug表示为第u个问题和第v个问题你必须选择相同的选项&#xff0c;题目问你&#xff0c;…

[css] 举例说明微信端兼容问题有哪些?

[css] 举例说明微信端兼容问题有哪些&#xff1f; 说一个微信小程序的iPhoneX适配吧&#xff0c; 因为iPhoneX底部没有虚拟按键&#xff0c;底部的横线会出现遮挡这时候就要处理下&#xff1a; 大概思路就是获取到客户端设备&#xff0c;然后判断是iPhoneX就换样式。 在app.js…

多线程创建方式 线程池、Future和CompletableFuture

大家好&#xff0c;我是烤鸭&#xff1a; 今天说一下 多线程的几种创建方式及使用。 1. Thread 和 Runnable 继承 Thread 类 和实现 Runnable 接口。 这种就不举例子了。 2.线程池 现在主要有5种线程池。 //缓存线程池ExecutorService cachedThreadPool Executors.newCa…

[css] 你有没有自己写过一套UI库?说下遇到哪些难点?

[css] 你有没有自己写过一套UI库&#xff1f;说下遇到哪些难点&#xff1f; 维护过&#xff0c;碰到的坑主要是 1&#xff09;同一个UI component在不同地方使用的customization问题。 2&#xff09;还有如果UI component如果有bug的话会导致所有使用的地方都出现bug 3&#x…

权限设计文章汇总

如何设计网站权限系统&#xff1f; https://www.zhihu.com/question/20313385/answer/118095995 我的转载&#xff1a;https://www.cnblogs.com/hao-1234-1234/p/9850967.html 应用程序权限设计 http://www.cnblogs.com/yukaizhao/archive/2007/04/15/user_role_action_permiss…

dubbo 整合 zipkin,最简单的方式,亲测有效

大家好&#xff0c;我是烤鸭。 之前也试过网上很多版本&#xff0c;看了好多文章。现在分享最简单的方式&#xff0c;代码侵入性最小的。 1. 修改pom,引入jar。 <!-- https://mvnrepository.com/artifact/org.springframework/spring-webmvc --> <dependency><…

[css] 说说你对GPU的理解,举例说明哪些元素能触发GPU硬件加速?

[css] 说说你对GPU的理解&#xff0c;举例说明哪些元素能触发GPU硬件加速&#xff1f; GPU: 图形处理器,用于处理图形有关的任务,用于渲染页面在css中使用 transform: translateZ(0),可以开启GPU硬件加速个人简介 我是歌谣&#xff0c;欢迎和大家一起交流前后端知识。放弃很容…