关键词

不起作用 选不到 失败

解释

input:first-child 要求既是input元素,而且是兄弟节点中的第一个

如果要找第一个input元素,那么用input:first-of-type

如果要用 first-child 最好是用后代组合器组合一下

.box :first-child {...}

假设存在带box类的元素

注意 first-of-type 指的是标签,不是 class 暂时未实现 first-of-class

【一句话】:first-child 伪类解释的更多相关文章

  1. CSS 基础知识点 样式 选择器 伪类

    CSS 基础知识点汇集 版权声明:这篇博客是别人写的,大神博客地址 : https://www.cnblogs.com/Mtime/p/5184685.html 1.CSS 简介 CSS 指层叠样式表 ...

  2. css总结13:CSS 伪类(Pseudo-classes)

    1 伪类作用:CSS伪类是用来添加一些选择器的特殊效果. 2 常用示例: 2.1anchor伪类:代码:   正常语法: a{color:#FF0000;}/* 文字颜色 */   伪类语法: a:l ...

  3. js进阶 10-7 简单的伪类选择器可以干什么

    js进阶 10-7 简单的伪类选择器可以干什么 一.总结 一句话总结:伪类选择器是冒号. 1.学而不用,有什么用? 多用啊,在项目中多用 2.简单的伪类选择器可以干什么? 除某元素以外,某元素的一切索 ...

  4. CSS:CSS 伪类(Pseudo-classes)

    ylbtech-CSS:CSS 伪类(Pseudo-classes) 1.返回顶部 1. CSS 伪类(Pseudo-classes) CSS伪类是用来添加一些选择器的特殊效果. 语法 伪类的语法: ...

  5. CSS 伪类(下)结构性伪类\UI伪类\动态伪类和其他伪类 valid check enable child required link visit

      伪类选择器汇总伪类选择器有4种, 结构性伪类\UI伪类\动态伪类和其他伪类. 具体如下 结构性伪类选择器结构性伪类选择器它能够根据元素在文档中的位置选择元素, 这类元素都有个前缀":&q ...

  6. CSS 类、伪类和伪元素差别具体解释

    CSS中的类(class)是为了方便过滤(即选择)元素,以给这类元素加入样式,class是定义在HTML文档树中的. 可是这在一些情况下是不够用的,比方用户的交互动作(悬停.激活等)会导致元素状态发生 ...

  7. CSS伪类:first-child与:first-of-type的异同

    CSS里关于元素匹配里面有两个非常类似却又不尽相同的选择器,伪类 :first-child 和 :first-of-type 两者在匹配方式上有很大差异,其实在一开始自己也没去注意这个细节,直到上次一 ...

  8. CSS3伪类与伪元素的区别及注意事项

    CSS中伪类与伪元素的概念是很容易混淆的 今天就来谈谈伪类与伪元素之间的区别 定义 首先先来看看伪类与伪元素的定义 w3c中对于它们是这么解释的 伪类:用于向某些选择器添加特殊的效果 伪元素:用于将特 ...

  9. CSS-用伪类制作小箭头(轮播图的左右切换btn)

    先上学习地址:http://www.htmleaf.com/Demo/201610234136.html 作者对轮播图左右按钮的处理方法一改往常,不是简单地用btn.prev+btn.next的图片代 ...

  10. 解密jQuery内核 Sizzle引擎筛选器 - 位置伪类(一)

    本章开始分析过滤器,根据API的顺序来 主要涉及的知识点 jQuery的组成 pushStack方法的作用 sizzle伪类选择器 首页我们知道jQuery对象是一个数组对象 内部结构 jQuery的 ...

随机推荐

  1. 第2-1-5章 docker安装MinIO实现文件存储服务-springboot整合minio-minio全网最全的资料

    目录 1. MinIO介绍 2. MinIO应用场景 2.1 单主机单硬盘模式 2.2 单主机多硬盘模式 2.3 多主机多硬盘分布式 3. MinIO特点 4. 存储机制 5. docker安装Min ...

  2. Blender建模软件怎么安装?有哪些好用的插件?

    1.下载Blender软件包,将压缩包解压后,使用鼠标左键双击打开安装文件. 2.由于压缩包内有两个安装文件,用户需要根据系统版本选择安装.可以使用鼠标右键单击桌面上的"此电脑"图 ...

  3. Go语言核心36讲03

    [Go语言代码较多,建议配合文章收听音频.] 你好,我是郝林.从今天开始,我将和你一起梳理Go语言的整个知识体系. 在过去的几年里,我与广大爱好者一起见证了Go语言的崛起. 从Go 1.5版本的自举( ...

  4. 【深入浅出 Yarn 架构与实现】3-2 Yarn Client 编写

    上篇文章介绍了编写 Yarn Application 的整体框架流程,本篇文章将详细介绍其中 Client 部分的编写方式. 一.Yarn Client 编写方法 本篇代码已上传 Github: Gi ...

  5. chronyd为隔离网络设置时间同步

    参考链接:https://access.redhat.com/documentation/en-us/red_hat_enterprise_linux/8/html/configuring_basic ...

  6. 在 Solidity 中 ++i 为什么比 i++ 更省 Gas?

    前言 作为一个初学者,"在 Solidity 中 ++i 为什么比 i++ 更省 Gas?" 这个问题始终在每个寂静的深夜困扰着我.也曾在网上搜索过相关问题,但没有得到根本性的解答 ...

  7. 关于C++ find

    #include <bits/stdc++.h> using namespace std; int a[1005]; int main() { for(int i = 0;i < 1 ...

  8. c++ 三种继承

    继承优先级:private>protect>public ​ 变量或函数函数本身的类型和继承方式,比较,取小的就是继承的访问性 ​ eg: protected x,通过private继承, ...

  9. Linux面试题2:网络IO模型 & IO多路复用

    网络IO 先确定一下范围,我们讨论的都是网络IO,现阶段计算机早已经从CPU密集型转换成网络IO密集型,所以网络io的类型对于服务响应而言更重要. 五种IO模型 依据Unix的IO分类,网络IO分为五 ...

  10. Promise基础知识

    Promise 1.Promise的前置小知识 进程(厂房) 程序的运行环境 线程(工人) 线程是实际进行运算的东西 同步 通常情况代码都是自上向下一行一行执行的 前边的代码不执行后边的代码也不会执行 ...