CSS3选择器之:nth-child(n)
第一次用到这个选择器还是为了解决下面了的问题:
手机的前端,我们使用了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)的更多相关文章
- 晨读笔记:CSS3选择器之属性选择器
一.属性选择器 1.E[foo^="bar"]:该属性选择器描述的是选择属性以bar开头的元素,如: //所有以名称g_开头的div的字体颜色为红色div[name^=" ...
- CSS3选择器之属性选择器
一.属性选择器 1.E[foo^="bar"]:该属性选择器描述的是选择属性以bar开头的元素,如: //所有以名称g_开头的div的字体颜色为红色div[name^=" ...
- CSS3选择器之学习笔记
首先说first-child与last-child,这两个选择器很容易明白,就是父元素下的第一个子元素和最后一个子元素.而nth-child和nth-last-child则是父元素下指定序号的子元素, ...
- 图解CSS选择器之nth家族
1 nth-last-of-type 顾名思义从最后开始的元素开始选取可接受 数字 关键词 公式 比如4n+0就是每隔四个 odd even关键词表示奇偶数 .classify-item:nth- ...
- css3类选择器之结合元素选择器和多类选择器
css3类选择器之结合元素选择器和多类选择器用法: <!DOCTYPE html> <html lang="en"> <head> <me ...
- CSS选择器之伪类选择器(元素)
:first-child 选择某个元素的第一个子元素(IE6不支持) :last-child 选择某个元素的最后一个子元素 :first-of-type [CSS3]选择一个上级元素下的第一个同类子元 ...
- Windows Phone开发(25):启动器与选择器之WebBrowserTask
原文:Windows Phone开发(25):启动器与选择器之WebBrowserTask 从名字上就看出来,这个家伙就是打开浏览并浏览到指定页面. 它有两个用途完全一样的属性:Uri属性是Syste ...
- Windows Phone开发(23):启动器与选择器之CameraCaptureTask和PhotoChooserTask
原文:Windows Phone开发(23):启动器与选择器之CameraCaptureTask和PhotoChooserTask 这两个组件都属于选择器,而且它们也有很多相似的地方,最明显的上一点, ...
- Windows Phone开发(26):启动器与选择器之MediaPlayerLauncher和SearchTask
原文:Windows Phone开发(26):启动器与选择器之MediaPlayerLauncher和SearchTask 启动器与选择器简单的地方在于,它们的使用方法几乎一模一样,从前面几节中,我相 ...
随机推荐
- oracle执行先决条件检查失败的解决方法
在安装oracle 11g时,出现执行先决条件失败的情况如下: 你可以忽略所有强制安装,一般不会影响功能,但如果你想知道为什么会产生这种错误, 并且当出现以上情况时又该如何解决呢?如下列出了原因和解决 ...
- linux定时任务调度定系统——opencron
linux定时任务调度定系统——opencron https://gitee.com/terrytan/opencron/#%E8%BF%90%E8%A1%8C%E7%8E%AF%E5%A2%83 一 ...
- Flutter 布局(十)- ListBody、ListView、CustomMultiChildLayout详解
本文主要介绍Flutter布局中的ListBody.ListView.CustomMultiChildLayout控件,详细介绍了其布局行为以及使用场景,并对源码进行了分析. 1. ListBody ...
- Flutter 依赖的那些事儿
Flutter 里面有2种库一样的东西, Package -creating a pure Dart component. like a new Widget. 这种是纯Dart,相当于你自己写的组件 ...
- Cookie管理 WebView同步
NoHttp的Cookie管理原理 在文档的初始化配置一章讲了NoHttp如何配置或者禁用cookie自动管理. NoHttp的Cookie自动维护,严格遵守Http协议,即区分临时Cookie和有效 ...
- vuejs组件库pk介绍
vuejs可以说是近2年多以来最火的前端框架,随之而来就产生了非常多的组件库,我们来看看其中比较著名和人气旺盛的几个 1. Vuetify-符合material design设计理念, star数量7 ...
- [SQLSERVER] 转移数据库MDF或LDF文件位置的方法,以及重新启动出现无权限的问题
0. 查看数据库文件名和物理文件名 SELECT name, physical_name AS current_file_location FROM sys.master_files 1. 运行命令 ...
- python第六十六天--sqlalchemy
#!usr/bin/env python #-*-coding:utf-8-*- # Author calmyan #python #2017/7/6 21:29 #__author__='Admin ...
- python第三十三天----静态方法、类方法、属性方法
@staticmethod 装饰后,类中的方法转成静态方法 class a: @staticmethod def b(self): print('') 静态方法不可以访问实例变量或类变量,相当于类中的 ...
- Oracle 单引号 双引号 转义符 分隔符
概述 单引号用来标记字符串 双引号用来标记识别对象名 以下使用会比较绕: 字符串中出现单引号.双引号: 表或字段等对象的别名(alias)中出单引号.双引号: 单引号.双引号与空格一起使用: 双引号 ...