关于:first-child的误区

版权声明：此博客转自“一个不想上班的程序员”博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
其原文链接：http://blog.csdn.net/eden00/article/details/105279921

记录此博客仅用于学习记录

前言
最近在项目中用到 :first-child 很容易的就想到了，嗯嗯。这不就是选择第一个元素吗？
好像很好用，平时使用中也没有遇到什么问题，理所当然的就以为它只会选中父元素下的第一个元素，对孙元素和曾孙元素没有影响。事实证明，我的理所当然是错的。

E:first-child的第一个误区（只会选中我规定的区域中的一个，不会遍历其下有多少个孙或曾孙元素）

上面的代码真的是只会有一个p标签生效吗？

这是后就已经犯了我们常见的第一个误区，认为body p:first-child选中的就是第一个元素。
其实，只要在我们选中的body这一块中，如果这个p在其父元素中属于第一个，那它就被选中。

E:first-child的第二个误区（不管这个E元素前面有几个兄弟，只要我是第一个E元素，那我就会生效）

还是上面的代码，但是我们在body中的p标签前加了一个font标签，发现p已经失效了。
上面的两个例子已经很清楚的告诉我们了这个选择器到底应该怎么用
E:first-child 用于选取属于其父元素的首个子元素的指定选择器

如何只选择指定元素中子元素呢？不考虑膝下有多少个孙子和曾孙呢。
子选择器(>) :只能选择作为某元素儿子元素的元素（直接子元素），不包括孙元素、曾孙元素等等等
还拿上面的代码举例，将>添上试一下效果

有时候使用错误的选择器，却没有报错。但错了就是错了。总有被发现的时候。
很庆幸这次的错误让我学到了知识。

本人个人实践

如果不用子选择器（>)的话

得到的结果就是两个svg都变成了同样的大小

最后通过上述博主的指导，明白需要使用子选择器(>)

最终实现指定第一个svg大小为35px

个人总结：在使用:first-child时，在左边使用子选择器（>）

关于:first-child的误区相关推荐

oracle 提示:ORA-02292:integrity constraint(xxxxxxx) violated - child record found
当我们删除数据的时候 oracle 提示:ORA-02292:integrity constraint(xxxxxxx) violated - child record found 这种情况呢是因为 ...
站覆盖范围_你了解无线覆盖范围和穿墙能力吗？别再走进这些误区了
目前,市面上的路由品牌.种类繁多,普通用户在选购时往往会有一些误区,如天线越多路由速率越高.信号越好.覆盖范围越大等等,造成的原因一是普通消费者缺乏相关知识,二是厂商或者店小二的忽悠.ZBT科研站就是 ...
C/C++数组初始化的一些误区
以前我这样初始化一个数组,并自我感觉良好: int a[5] = { 0 }; // 全部初始化为0 这种简单的写法让我非常爽,于是我又想把数组全部初始化为1: int a[5] = { 1 }; / ...
jmeter分析性能报告时的误区
概述我们用jmeter做性能测试,必然需要学会分析测试报告.但是初学者常常因为对概念的不清晰,最后被测试报告带到沟里去. 常见的误区分析响应时间全用平均值响应时间不和吞吐量挂钩响应时间和吞吐量 ...
初学web标准的几个误区
初学web标准的几个误区作者:阿捷 2004-7-7 11:37:11 非常高兴地看到很多设计师开始关注和尝试使用web标准制作网页.但从网友们的问题和制作中发现几个问题,在这里特别提醒一下: 1. ...
ATL::CStringA和std::string之间转换的一些误区
对于刚做windows下VC的开发同学,类型转换应该是一个令其很苦恼的问题.我刚写工作的时候,也为这类问题不停的在网上搜索转换方法.最近工作中遇到一个"神奇"的bug(一般&quo ...
架构周报| 浅析MySQL JDBC连接配置上的两个误区
经典案例 \\ 浅析MySQL JDBC连接配置上的两个误区:相信使用MySQL的同学都配置过它的JDBC驱动,多数人会直接从哪里贴一段URL过来,然后稍作修改就上去了,对应的连接池配置也是一样的,很 ...
Web前端工程师的一些常见误区
想要作为一名合格的web前端工程师,那么掌握基本的开发技术是远远不够的,在职场中还要少犯一些错误,本期小编为大家分享的web前端培训教程主要是介绍一些web前端工程师常见的误区,希望对大家有所帮助. ...
参加java培训，要避免这几个误区!
java技术在近几年学习的人越来越多,小编在这里提醒同学们,想要学好java技术,除了报班系统培训之外,还要找到适合自己的学习方法,以下几点误区同学们一定要避免! 参加java培训,要避免这几 ...
Java新手会遇到的三大误区，一定要避免!
很多学习java技术的学员都是零基础学员,之前对java技术一点都不了解,所以java新手在学习java技术的时候很容易进入误区,下面小编分享的Java新手会遇到的三大误区,一定要避免! 作为目前最为 ...

关于:first-child的误区

关于:first-child的误区相关推荐

最新文章

热门文章