第一次用到这个选择器还是为了解决下面了的问题:

手机的前端,我们使用了mint-ui,里面有一个日期选择控件,但是选择的时候没有提供年月的选择器,如:

而是提供了下面的方式:

为了达到上面的效果,使用了一个讨巧的方法,用CSS3的选择器:nth-child(n),直接让第3个(天数)元素隐藏掉。

  .picker-slot.picker-slot-center:nth-child(3){
display: none;
}

参考文档:

http://www.w3school.com.cn/cssref/css_selectors.asp

http://www.w3school.com.cn/cssref/selector_nth-child.asp

https://zhidao.baidu.com/question/2117823454569545467.html

CSS3选择器之:nth-child(n)的更多相关文章

  1. 晨读笔记:CSS3选择器之属性选择器

    一.属性选择器 1.E[foo^="bar"]:该属性选择器描述的是选择属性以bar开头的元素,如: //所有以名称g_开头的div的字体颜色为红色div[name^=" ...

  2. CSS3选择器之属性选择器

    一.属性选择器 1.E[foo^="bar"]:该属性选择器描述的是选择属性以bar开头的元素,如: //所有以名称g_开头的div的字体颜色为红色div[name^=" ...

  3. CSS3选择器之学习笔记

    首先说first-child与last-child,这两个选择器很容易明白,就是父元素下的第一个子元素和最后一个子元素.而nth-child和nth-last-child则是父元素下指定序号的子元素, ...

  4. 图解CSS选择器之nth家族

    1 nth-last-of-type  顾名思义从最后开始的元素开始选取可接受 数字 关键词 公式  比如4n+0就是每隔四个 odd even关键词表示奇偶数 .classify-item:nth- ...

  5. css3类选择器之结合元素选择器和多类选择器

    css3类选择器之结合元素选择器和多类选择器用法: <!DOCTYPE html> <html lang="en"> <head> <me ...

  6. CSS选择器之伪类选择器(元素)

    :first-child 选择某个元素的第一个子元素(IE6不支持) :last-child 选择某个元素的最后一个子元素 :first-of-type [CSS3]选择一个上级元素下的第一个同类子元 ...

  7. Windows Phone开发(25):启动器与选择器之WebBrowserTask

    原文:Windows Phone开发(25):启动器与选择器之WebBrowserTask 从名字上就看出来,这个家伙就是打开浏览并浏览到指定页面. 它有两个用途完全一样的属性:Uri属性是Syste ...

  8. Windows Phone开发(23):启动器与选择器之CameraCaptureTask和PhotoChooserTask

    原文:Windows Phone开发(23):启动器与选择器之CameraCaptureTask和PhotoChooserTask 这两个组件都属于选择器,而且它们也有很多相似的地方,最明显的上一点, ...

  9. Windows Phone开发(26):启动器与选择器之MediaPlayerLauncher和SearchTask

    原文:Windows Phone开发(26):启动器与选择器之MediaPlayerLauncher和SearchTask 启动器与选择器简单的地方在于,它们的使用方法几乎一模一样,从前面几节中,我相 ...

随机推荐

  1. Flutter 不一样的跨平台解决方案

    本文主要介绍Flutter相关的东西,包括Fuchsia.Dart.Flutter特性.安装以及整体架构等内容. 1. 简介 Flutter作为谷歌最近推出的跨平台开发框架,一经推出便吸引了不少注意. ...

  2. 记录C/C++中遇到的一些小问题

    1. printf 比如 char a = \x90; printf("%02x", a); 想输出为90,没想到却是ffffff90,这个问题害我一个程序老是出错 最终发现只要改 ...

  3. 在Java中动态传参调用Python脚本

    最近,又接触到一个奇葩的接口,基于老板不断催促赶时间的情况下,在重写java接口和复用已有的python脚本的两条路中选择了后者,但是其实后者并没有好很多,因为我是一个对python的认识仅限于其名称 ...

  4. web高并发的解决方案

    我们先了解一下什么是并发和并行 并发:并发是指两个或多个事件在同一时间间隔内发生,就是可以重叠在时间段启动,并发是指一个时间段中有几个程序都处于已启动运行到运行完毕之间,且这几个程序都是在同一个处理机 ...

  5. 关于elk中filebeat定义好日志输出,但是redis里面却没有输出内容的问题

    这两天在搞elk的时候,filebeat中指定输出日志至Broker(此处Broker采用redis作为缓存),但是redis中却没有内容,所以就开始排查来 filebeat采用RPM安装的方式来的. ...

  6. SAP CRM 开发学习资料和教程整理【不定时更新】

    本文链接:http://www.cnblogs.com/hhelibeb/p/6276929.html 首先是SAP网站上面的相关内容 SAP Customer Relationship Manage ...

  7. 控件布局_TableLayout

    <?xml version="1.0" encoding="utf-8"?> <TableLayout xmlns:android=" ...

  8. MongoDB修改与聚合二

    1.修改方法 一 语法 里面有三个大的语句:一个是查询条件:一个是修改字段:一个是其他参数(目前就有两个) db.table.update( 条件, 修改字段, 其他参数 ) update db1.t ...

  9. [笔记]一些STL用法

    参考资料:STL 在 OI 中的应用 离散化 std::unique 功能:对有序的容器重新排列,将第一次出现的元素从前往后排,其他重复出现的元素依次排在后面 返回值:返回迭代器,迭代器指向的是重复元 ...

  10. windows下安装ElasticSearch的Head插件

    es5以上版本安装head需要安装node和grunt(之前的直接用plugin命令即可安装) (一)从地址:https://nodejs.org/en/download/ 下载相应系统的msi,双击 ...