美文网首页
高效-4css实现前向选择器

高效-4css实现前向选择器

作者: 钱学敏 | 来源:发表于2018-05-20 13:03 被阅读0次

如下html结构,想要实现:当有两个item时,隐藏第二个

<div class="item">第1个</div>
<div class="item">第2个</div>

可以使用相邻选择器

.item  + .item{
  display: none;
}

但是要实现:当有两个item时,隐藏第一个,只有一个item时不隐藏第一个。
由于css没有前向选择器,所以需要用nth-last-type实现

.item:nth-of-type(1):nth-last-of-type(2){
  display: none;
}

相关文章

  • 高效-4css实现前向选择器

    如下html结构,想要实现:当有两个item时,隐藏第二个 可以使用相邻选择器 但是要实现:当有两个item时,隐...

  • 自定义时间选择器

    自定义时间选择器 这里使用符合控件的形式来编写,过于复杂这难于理解,能够高效实现需求。 一、时间选择器需求分析 这...

  • jQuery|"lt"年级前3名

    jQuery :lt() 选择器可以帮助你实现所有的制定下标前的所有的元素。 实例 选择前 4 个之后的所有 ...

  • css-伪类,伪元素

    1.伪类 - 向选择器 设置特殊条件 - 可以选择到包含特殊含义的元素。 2.伪元素 - 向选择器 添...

  • [Machine Learning From Scratch]-

    全连接层实现代码: 全连接神经网络做线性回归 一、定义前向、后向传播本文将用numpy实现全连接层的前向过程和反向...

  • 伪类和伪元素

    伪类:CSS 伪类用于向某些选择器添加特殊的效果。 伪元素:CSS 伪元素用于向某些选择器设置特殊效果。 1、伪类...

  • 生日选择器

    如何快速实现一个生日选择器? 我们可以通过UIDatePicker对象快速的实现一个生日选择器,下面是主要的代码逻...

  • CSS选择器(了解)

    以下是5种选择器1标签选择器 2类选择器 07CSS选择器 床前明月光 3 i...

  • 2022-04-19 纯 CSS 实现瀑布流式排版

    前阵子在写一个图片选择器时,想实现纯 CSS 对图片进行瀑布流式排版 (Masonry Layout)。一个合格的...

  • [实现] angular的directive + laydate

    [实现] angular的directive + laydate 实现日期选择器 因为最近anguar项目里大量用...

网友评论

      本文标题:高效-4css实现前向选择器

      本文链接:https://www.haomeiwen.com/subject/zytzdftx.html