Introduction:

介绍:

Well, selectors are a very common term to deal with while we are developing a website or web page. You might know quite a few of them and might as well be implementing them. You might also have noticed that all the selectors are used for selecting some element or other, well that's their entire purpose and thus the name selectors. Although all the selectors share common characteristics but not all of them are the same. Their behaviors differ to a very great extent and one can only know after practical implementation. So, since we are discussing selectors, why don't we talk about one very specific selector? Although you might have come across this selector at some point of your time. The selector we will be focused on is not:first-child selector. To know more about this selector just keep reading on!

好吧,在我们开发网站或网页时,选择器是一个很常见的术语。 您可能知道很多,也可能正在实施它们。 您可能还已经注意到,所有选择器都用于选择某些元素或其他元素,这就是它们的全部用途,因此也就是名称选择器。 尽管所有选择器都具有共同的特征,但并非所有选择器都相同。 它们的行为差异很大,只有在实际实施后才能知道。 因此,既然我们正在讨论选择器,为什么不谈论一个非常具体的选择器呢? 尽管您可能在某个时候遇到了此选择器。 我们将关注的选择器不是:first-child选择器 。 要了解有关此选择器的更多信息,请继续阅读!

Well, the name sounds a bit weird, doesn't it? Not: first child. So, that brings us to the question of what does this selector does and how is this selector different from other selectors. Well, the functioning and behavior of this selector are not very tough to understand and you can easily figure out from the name itself that for what purpose this selector is put to use. So let us look at a more formal definition of this selector so that we get a better gist of it.

好吧,这个名字听起来有些怪异,不是吗? 不:第一个孩子。 因此,这就引出了这个选择器的作用以及该选择器与其他选择器有何不同的问题。 好吧,这个选择器的功能和行为并不是很难理解的,您可以很容易地从名称本身中得知该选择器用于什么目的。 因此,让我们看一下这个选择器的更正式定义,以便我们更好地了解它。

Definition:

定义:

The not:first-child selector as the name suggests is used to select every element which is not the first child element of it's deriving parent element. Pretty simple right? The selector is not used for choosing the first child of its parent element. This selector is usually represented as an argument and it is seen in the form of not(first-child). To help you understand this in a better way, why don't you go ahead and have a look at the syntax below,

顾名思义, not:first-child选择器用于选择不是其派生父元素的第一个子元素的每个元素。 很简单吧? 选择器不用于选择其父元素的第一个子元素。 该选择器通常表示为一个参数,并且以not(first-child)的形式出现。 为了帮助您更好地理解这一点,为什么不继续阅读下面的语法,

    :not(element){
//some CSS property
}

Example:

例:

In the above example the div element contains <ul> elements, so it selects all child elements of <div> tag except its first-child and applies the CSS styles.

在上面的示例中,div元素包含<ul>元素,因此它将选择<div>标记的所有子元素(第一个孩子除外)并应用CSS样式。

Piece of advice:

一点建议:

Now, it is time to make use of your new-found knowledge. But before you get on with that make sure you use this selector properly wherever required because you don't want your code to get ruined just because of a silly mistake right? Not just this one you must use every selector wisely to make your website or web page responsive and whenever in doubt, you will always have this article for your reference. Also, if you have some issues with our code and practice, we are always available to help you at https://ask.includehelp.com/.

现在,该利用您新发现的知识了。 但是在继续之前,请确保在所需的任何地方正确使用此选择器,因为您不希望仅仅因为一个愚蠢的错误而导致代码被破坏吗? 您不仅必须明智地使用每个选择器,以使您的网站或网页具有响应能力,而且如有疑问,您将始终可以将本文作为参考。 另外,如果您对我们的代码和实践有任何疑问,请访问https://ask.includehelp.com/随时可以为您提供帮助。

翻译自: https://www.includehelp.com/code-snippets/using-a-not-first-child-selector-in-css.aspx

在CSS中使用not:first-child选择器相关推荐

  1. 妙味css3课程---1-1、css中自定义属性可以用属性选择器么

    妙味css3课程---1-1.css中自定义属性可以用属性选择器么 一.总结 一句话总结:可以的. 1.如何实现用属性选择器实现a标签根据href里面含有的字段选择背景图片? p a[href*=te ...

  2. CSS中的nth-child和nth-of-type选择器

    CSS中的nth-child和nth-type-of选择器 先写一个例子 <head><style>*{margin: 0px;padding: 0px;}.item{vert ...

  3. css中什么是伪类选择器?伪类选择器的简要介绍

    本章给大家带来css中什么是伪类选择器?伪类选择器的简要介绍.让大家可以了解在css中伪类选择器的作用,css伪类选择器有哪些分类等知识.有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助. ...

  4. CSS中常用的几种选择器是哪几种呢?

    CSS中常用的选择器: (一)基本选择器(二)层次选择器(三)动态伪类选择器(四)目标伪类选择器 (五)ui状态伪类选择器(六)结构伪类选择器(七)属性选择器(八)伪元素      (一)基本选择器 ...

  5. css中什么是伪类选择器?伪类选择器的简介

    一.伪类选择器介绍 伪类选择器(简称:伪类)通过冒号来定义,它定义了元素的状态,如点击按下,点击完成等,通过伪类可以为元素的状态修改样式. 伪类的功能和一般的DOM中的元素样式相似,但和一般的DOM中 ...

  6. CSS中常用的伪类选择器

    一 .伪类(不存在的类,特殊的类) -伪类用来描述一个元素的特殊状态 比如:第一个元素,被点击的元素,鼠标移入的元素··· -特点:一般请情况下,使用:开头 1. :first-child 第一个子元 ...

  7. CSS中含有特定文字的选择器

    [class^="text"]{ } 选中所有以text为开头类名的选择器 [class*="text"]{ } 选中所有含text为类名的选择器

  8. CSS中的四种样式及选择器

    CSS语法 选择符表示要定义样式的对象,可以是元素本身,也可以是一类元素或者制定名称的元素. 属性:属性是指定选择符所具有的属性,它是css的核心,css2共有150多个属性 属性值:属性值包括法定属 ...

  9. html语言div什么意思,css中div是什么意思?

    css中div是什么意思? div是html中的一个标签,通常作为容纳其他元素的容器.在css中,表示一种选择器,可以直接使用div(标签选择器)来查找HTML元素设置样式:而如果是.div那么表示某 ...

最新文章

  1. Linux下KVM的图形界面管理工具(virt-manager)(桌面版)
  2. mysql客户端与服务端_mysql语句在客户端与服务端的基本使用
  3. linux tr 变量大小写,使用tr命令快速达到大小写互换——深圳培训linux
  4. java接收的文件转换成临时文件_Android中怎样使用createTempFile实现将字节数据创建到临时文件并转换成FileOutputStream和FileInputStream...
  5. 知乎:什么时候你是产品经理,而不是产品助理?
  6. 如果征信有这些行为,申请房贷直接被拒绝
  7. Arduino从DHT11读取温湿度数据并显示在1602LCD
  8. 五年级下册电子计算机与多媒体,语文人教版五年级下册《电子计算机与多媒体》.doc...
  9. Python(65)_写函数,判断用户传入列表的长度,若大于2,则仅保留前两个长度的内容,并将其返回给调用者...
  10. linux用户管理命令 2
  11. Android 创建一个新的Activity
  12. Android IPC系列(三):Binder概述
  13. 3.struts2中Action的三种写法
  14. qt 创建第二个ui_Qt自定义提示信息弹窗
  15. 排队模型和排队系统仿真
  16. android 读取excel表格数据,并存入数据库
  17. k8s 应用更新策略:灰度发布和蓝绿发布
  18. web端常见导航设计
  19. AB-test理解与实战
  20. 扩增子分析全面升级!加量不加价,数据更多新玩法

热门文章

  1. 向上传文件服务器,向服务器上传文件
  2. java对mysql查询_如何利用java对mysql数据库进行增删改查
  3. es 删除重复数据_怎么标识并删除SPSS数据库里的“重复个案”?
  4. php laravel 返回统一格式,封装的统一的Laravel响应类,返回数据类
  5. Deepin安装最新显卡RTX2080Ti及CUDA10.1
  6. C# Collection was modified;enumeration operation may not execute
  7. 关于Linux网卡调优之:RPS (Receive Packet Steering)
  8. Spark算子篇 --Spark算子之combineByKey详解
  9. 二分查找和二叉查找树
  10. [转]android webview学习